From 0add3d76aadbf556f825a502974eb83b1ed6c5a2 Mon Sep 17 00:00:00 2001 From: Thomas Jang Date: Mon, 4 Apr 2016 21:48:11 +0900 Subject: [PATCH] ax5ui-modal@0.5.4 refactoring --- bower.json | 2 +- dist/ax5modal.js | 165 +++++++++---------- dist/ax5modal.min.js | 2 +- package.json | 2 +- src/ax5modal.js | 383 ++++++++++++++++++++++--------------------- 5 files changed, 284 insertions(+), 270 deletions(-) diff --git a/bower.json b/bower.json index 6a08cde..87803cb 100644 --- a/bower.json +++ b/bower.json @@ -1,6 +1,6 @@ { "name": "ax5ui-modal", - "version": "0.5.3", + "version": "0.5.4", "authors": [ "ThomasJ " ], diff --git a/dist/ax5modal.js b/dist/ax5modal.js index 4fbc445..0152db2 100755 --- a/dist/ax5modal.js +++ b/dist/ax5modal.js @@ -6,7 +6,7 @@ /** * @class ax5.ui.modal * @classdesc - * @version 0.5.3 + * @version 0.5.4 * @author tom@axisj.com * @example * ``` @@ -40,71 +40,39 @@ cfg = this.config; // extended config copy cfg cfg.id = 'ax5-modal-' + ax5.getGuid(); // instance id - /** - * Preferences of modal UI - * @method ax5.ui.modal.setConfig - * @param {Object} config - 클래스 속성값 - * @returns {ax5.ui.modal} - * @example - * ``` - * ``` - */ - //== class body start - this.init = function () { - this.onStateChanged = cfg.onStateChanged; - }; - - this.getContent = function (modalId, opts) { - var po = [], - styles = []; - - if (opts.zIndex) { - styles.push("z-index:" + opts.zIndex); + var onStateChanged = function onStateChanged(opts, that) { + if (opts && opts.onStateChanged) { + opts.onStateChanged.call(that, that); + } else if (this.onStateChanged) { + this.onStateChanged.call(that, that); } + return true; + }, + getContentTmpl = function getContentTmpl() { + return "\n
\n
\n {{#iframe}}\n
\n \n
\n
\n \n {{#param}}\n {{#@each}}\n \n {{/@each}}\n {{/param}}\n
\n {{/iframe}}\n
\n
\n "; + }, + getContent = function getContent(modalId, opts) { + var data = { + modalId: modalId, + theme: opts.theme, + fullScreen: opts.fullScreen ? "fullscreen" : "", + styles: [], + iframe: opts.iframe + }; - po.push('
'); - po.push('
'); - // use iframe - if (opts.iframe) { - po.push('
'); - po.push(''); - po.push('
'); - po.push('
'); - po.push(''); - if (typeof opts.iframe.param === "string") { - opts.iframe.param = ax5.util.param(opts.iframe.param); - } - for (var p in opts.iframe.param) { - po.push(''); - } - po.push('
'); + if (opts.zIndex) { + data.styles.push("z-index:" + opts.zIndex); } - po.push('
'); - po.push('
'); - return po.join(''); - }; - - this.open = function (opts, callBack) { - if (U.isString(opts)) { - opts = { - title: cfg.title, - msg: opts - }; + if (typeof data.iframe.param === "string") { + data.iframe.param = ax5.util.param(data.iframe.param); } - self.modalConfig = {}; - jQuery.extend(true, self.modalConfig, cfg); - jQuery.extend(true, self.modalConfig, opts); - opts = self.modalConfig; - - this._open(opts, callBack); - return this; - }; - - this._open = function (opts, callBack) { + return ax5.mustache.render(getContentTmpl(), data); + }, + open = function open(opts, callBack) { var that; - jQuery(document.body).append(this.getContent(opts.id, opts)); + jQuery(document.body).append(getContent.call(this, opts.id, opts)); this.activeModal = jQuery('#' + opts.id); @@ -121,7 +89,7 @@ } //- position 정렬 - this.align(); + align.call(this); that = { self: this, @@ -144,34 +112,25 @@ this.$["iframe-form"].attr({ "action": opts.iframe.url }); this.$["iframe"].on("load", function () { that.state = "load"; - if (opts && opts.onStateChanged) { - opts.onStateChanged.call(that, that); - } else if (this.onStateChanged) { - this.onStateChanged.call(that, that); - } + onStateChanged.call(this, opts, that); }.bind(this)); this.$["iframe-form"].submit(); } if (callBack) callBack.call(that); - if (opts && opts.onStateChanged) { - opts.onStateChanged.call(that, that); - } else if (this.onStateChanged) { - this.onStateChanged.call(that, that); - } + onStateChanged.call(this, opts, that); // bind key event if (opts.closeToEsc) { jQuery(window).bind("keydown.ax-modal", function (e) { - this.onkeyup(e || window.event); + onkeyup.call(this, e || window.event); }.bind(this)); } jQuery(window).bind("resize.ax-modal", function (e) { - this.align(null, e || window.event); + align.call(this, null, e || window.event); }.bind(this)); - }; - - this.align = function (position, e) { + }, + align = function align(position, e) { if (!this.activeModal) return this; var opts = self.modalConfig, box = { @@ -219,14 +178,55 @@ this.activeModal.css(box); return this; - }; - - this.onkeyup = function (e) { + }, + onkeyup = function onkeyup(e) { if (e.keyCode == ax5.info.eventKeys.ESC) { this.close(); } }; + /// private end + + /** + * Preferences of modal UI + * @method ax5.ui.modal.setConfig + * @param {Object} config - 클래스 속성값 + * @returns {ax5.ui.modal} + * @example + * ``` + * ``` + */ + //== class body start + this.init = function () { + this.onStateChanged = cfg.onStateChanged; + }; + + /** + * open the modal + * @method ax5.ui.modal.open + * @returns {ax5.ui.modal} + * @example + * ``` + * my_modal.open(); + * ``` + */ + this.open = function (opts, callBack) { + if (U.isString(opts)) { + opts = { + title: cfg.title, + msg: opts + }; + } + + self.modalConfig = {}; + jQuery.extend(true, self.modalConfig, cfg); + jQuery.extend(true, self.modalConfig, opts); + opts = self.modalConfig; + + open.call(this, opts, callBack); + return this; + }; + /** * close the modal * @method ax5.ui.modal.close @@ -250,11 +250,10 @@ self: this, state: "close" }; - if (opts && opts.onStateChanged) { - opts.onStateChanged.call(that, that); - } else if (this.onStateChanged) { - this.onStateChanged.call(that, that); - } + onStateChanged.call(this, opts, { + self: this, + state: "close" + }); }.bind(this), cfg.animateTime); } return this; diff --git a/dist/ax5modal.min.js b/dist/ax5modal.min.js index 71adece..1b526d1 100755 --- a/dist/ax5modal.min.js +++ b/dist/ax5modal.min.js @@ -1 +1 @@ -"use strict";!function(i,t){var e=ax5.util,a=function(){var i,a=this;t&&t.call(this),this.activeModal=null,this.$={},this.config={position:{left:"center",top:"middle",margin:10},clickEventName:"click",theme:"default",width:300,height:400,closeToEsc:!0,animateTime:250},i=this.config,i.id="ax5-modal-"+ax5.getGuid(),this.init=function(){this.onStateChanged=i.onStateChanged},this.getContent=function(i,t){var e=[],a=[];if(t.zIndex&&a.push("z-index:"+t.zIndex),e.push('
'),e.push('
'),t.iframe){e.push('
'),e.push(''),e.push("
"),e.push('
'),e.push(''),"string"==typeof t.iframe.param&&(t.iframe.param=ax5.util.param(t.iframe.param));for(var o in t.iframe.param)e.push('');e.push("
")}return e.push("
"),e.push("
"),e.join("")},this.open=function(t,o){return e.isString(t)&&(t={title:i.title,msg:t}),a.modalConfig={},jQuery.extend(!0,a.modalConfig,i),jQuery.extend(!0,a.modalConfig,t),t=a.modalConfig,this._open(t,o),this},this._open=function(i,t){var e;jQuery(document.body).append(this.getContent(i.id,i)),this.activeModal=jQuery("#"+i.id),this.$={root:this.activeModal.find('[data-modal-els="root"]'),body:this.activeModal.find('[data-modal-els="body"]')},i.iframe&&(this.$["iframe-wrap"]=this.activeModal.find('[data-modal-els="iframe-wrap"]'),this.$.iframe=this.activeModal.find('[data-modal-els="iframe"]'),this.$["iframe-form"]=this.activeModal.find('[data-modal-els="iframe-form"]')),this.align(),e={self:this,id:i.id,theme:i.theme,width:i.width,height:i.height,state:"open",$:this.$},i.iframe&&(this.$["iframe-wrap"].css({height:i.height}),this.$.iframe.css({height:i.height}),this.$["iframe-form"].attr({method:i.iframe.method}),this.$["iframe-form"].attr({target:i.id+"-frame"}),this.$["iframe-form"].attr({action:i.iframe.url}),this.$.iframe.on("load",function(){e.state="load",i&&i.onStateChanged?i.onStateChanged.call(e,e):this.onStateChanged&&this.onStateChanged.call(e,e)}.bind(this)),this.$["iframe-form"].submit()),t&&t.call(e),i&&i.onStateChanged?i.onStateChanged.call(e,e):this.onStateChanged&&this.onStateChanged.call(e,e),i.closeToEsc&&jQuery(window).bind("keydown.ax-modal",function(i){this.onkeyup(i||window.event)}.bind(this)),jQuery(window).bind("resize.ax-modal",function(i){this.align(null,i||window.event)}.bind(this))},this.align=function(i,t){if(!this.activeModal)return this;var e=a.modalConfig,o={width:e.width,height:e.height};return e.fullScreen?(o.width=jQuery(window).width(),o.height=jQuery(window).height(),o.left=0,o.top=0,e.iframe&&(this.$["iframe-wrap"].css({height:o.height}),this.$.iframe.css({height:o.height}))):(i&&jQuery.extend(!0,e.position,i),"left"==e.position.left?o.left=e.position.margin||0:"right"==e.position.left?o.left=jQuery(window).width()-o.width-(e.position.margin||0):"center"==e.position.left?o.left=jQuery(window).width()/2-o.width/2:o.left=e.position.left||0,"top"==e.position.top?o.top=e.position.margin||0:"bottom"==e.position.top?o.top=jQuery(window).height()-o.height-(e.position.margin||0):"middle"==e.position.top?o.top=jQuery(window).height()/2-o.height/2:o.top=e.position.top||0),this.activeModal.css(o),this},this.onkeyup=function(i){i.keyCode==ax5.info.eventKeys.ESC&&this.close()},this.close=function(t,e){return this.activeModal&&(t=a.modalConfig,this.activeModal.addClass("destroy"),jQuery(window).unbind("keydown.ax-modal"),jQuery(window).unbind("resize.ax-modal"),setTimeout(function(){this.activeModal.remove(),this.activeModal=null,e={self:this,state:"close"},t&&t.onStateChanged?t.onStateChanged.call(e,e):this.onStateChanged&&this.onStateChanged.call(e,e)}.bind(this),i.animateTime)),this},this.css=function(i){return this.activeModal&&!a.fullScreen&&(this.activeModal.css(i),i.width&&(a.modalConfig.width=this.activeModal.width()),i.height&&(a.modalConfig.height=this.activeModal.height(),this.$.iframe&&(this.$["iframe-wrap"].css({height:a.modalConfig.height}),this.$.iframe.css({height:a.modalConfig.height})))),this},this.main=function(){arguments&&e.isObject(arguments[0])&&this.setConfig(arguments[0])}.apply(this,arguments)};i.modal=function(){return e.isFunction(t)&&(a.prototype=new t),a}()}(ax5.ui,ax5.ui.root); \ No newline at end of file +"use strict";!function(i,t){var e=ax5.util,a=function(){var i,a=this;t&&t.call(this),this.activeModal=null,this.$={},this.config={position:{left:"center",top:"middle",margin:10},clickEventName:"click",theme:"default",width:300,height:400,closeToEsc:!0,animateTime:250},i=this.config,i.id="ax5-modal-"+ax5.getGuid();var o=function(i,t){return i&&i.onStateChanged?i.onStateChanged.call(t,t):this.onStateChanged&&this.onStateChanged.call(t,t),!0},n=function(){return'\n
\n
\n {{#iframe}}\n
\n \n
\n
\n \n {{#param}}\n {{#@each}}\n \n {{/@each}}\n {{/param}}\n
\n {{/iframe}}\n
\n
\n '},s=function(i,t){var e={modalId:i,theme:t.theme,fullScreen:t.fullScreen?"fullscreen":"",styles:[],iframe:t.iframe};return t.zIndex&&e.styles.push("z-index:"+t.zIndex),"string"==typeof e.iframe.param&&(e.iframe.param=ax5.util.param(e.iframe.param)),ax5.mustache.render(n(),e)},d=function(i,t){var e;jQuery(document.body).append(s.call(this,i.id,i)),this.activeModal=jQuery("#"+i.id),this.$={root:this.activeModal.find('[data-modal-els="root"]'),body:this.activeModal.find('[data-modal-els="body"]')},i.iframe&&(this.$["iframe-wrap"]=this.activeModal.find('[data-modal-els="iframe-wrap"]'),this.$.iframe=this.activeModal.find('[data-modal-els="iframe"]'),this.$["iframe-form"]=this.activeModal.find('[data-modal-els="iframe-form"]')),h.call(this),e={self:this,id:i.id,theme:i.theme,width:i.width,height:i.height,state:"open",$:this.$},i.iframe&&(this.$["iframe-wrap"].css({height:i.height}),this.$.iframe.css({height:i.height}),this.$["iframe-form"].attr({method:i.iframe.method}),this.$["iframe-form"].attr({target:i.id+"-frame"}),this.$["iframe-form"].attr({action:i.iframe.url}),this.$.iframe.on("load",function(){e.state="load",o.call(this,i,e)}.bind(this)),this.$["iframe-form"].submit()),t&&t.call(e),o.call(this,i,e),i.closeToEsc&&jQuery(window).bind("keydown.ax-modal",function(i){l.call(this,i||window.event)}.bind(this)),jQuery(window).bind("resize.ax-modal",function(i){h.call(this,null,i||window.event)}.bind(this))},h=function(i,t){if(!this.activeModal)return this;var e=a.modalConfig,o={width:e.width,height:e.height};return e.fullScreen?(o.width=jQuery(window).width(),o.height=jQuery(window).height(),o.left=0,o.top=0,e.iframe&&(this.$["iframe-wrap"].css({height:o.height}),this.$.iframe.css({height:o.height}))):(i&&jQuery.extend(!0,e.position,i),"left"==e.position.left?o.left=e.position.margin||0:"right"==e.position.left?o.left=jQuery(window).width()-o.width-(e.position.margin||0):"center"==e.position.left?o.left=jQuery(window).width()/2-o.width/2:o.left=e.position.left||0,"top"==e.position.top?o.top=e.position.margin||0:"bottom"==e.position.top?o.top=jQuery(window).height()-o.height-(e.position.margin||0):"middle"==e.position.top?o.top=jQuery(window).height()/2-o.height/2:o.top=e.position.top||0),this.activeModal.css(o),this},l=function(i){i.keyCode==ax5.info.eventKeys.ESC&&this.close()};this.init=function(){this.onStateChanged=i.onStateChanged},this.open=function(t,o){return e.isString(t)&&(t={title:i.title,msg:t}),a.modalConfig={},jQuery.extend(!0,a.modalConfig,i),jQuery.extend(!0,a.modalConfig,t),t=a.modalConfig,d.call(this,t,o),this},this.close=function(t,e){return this.activeModal&&(t=a.modalConfig,this.activeModal.addClass("destroy"),jQuery(window).unbind("keydown.ax-modal"),jQuery(window).unbind("resize.ax-modal"),setTimeout(function(){this.activeModal.remove(),this.activeModal=null,e={self:this,state:"close"},o.call(this,t,{self:this,state:"close"})}.bind(this),i.animateTime)),this},this.css=function(i){return this.activeModal&&!a.fullScreen&&(this.activeModal.css(i),i.width&&(a.modalConfig.width=this.activeModal.width()),i.height&&(a.modalConfig.height=this.activeModal.height(),this.$.iframe&&(this.$["iframe-wrap"].css({height:a.modalConfig.height}),this.$.iframe.css({height:a.modalConfig.height})))),this},this.main=function(){arguments&&e.isObject(arguments[0])&&this.setConfig(arguments[0])}.apply(this,arguments)};i.modal=function(){return e.isFunction(t)&&(a.prototype=new t),a}()}(ax5.ui,ax5.ui.root); \ No newline at end of file diff --git a/package.json b/package.json index 113c6d0..7fb6eed 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "ax5ui-modal", - "version": "0.5.3", + "version": "0.5.4", "description": "A modal plugin that works with Bootstrap & jQuery", "license": "Apache 2.0", "repository": { diff --git a/src/ax5modal.js b/src/ax5modal.js index e10eb85..b9f8739 100755 --- a/src/ax5modal.js +++ b/src/ax5modal.js @@ -1,19 +1,19 @@ // ax5.ui.modal (function (root, _SUPER_) { - + /** * @class ax5.ui.modal * @classdesc - * @version 0.5.3 + * @version 0.5.4 * @author tom@axisj.com * @example * ``` * var my_modal = new ax5.ui.modal(); * ``` */ - + var U = ax5.util; - + //== UI Class var axClass = function () { var @@ -38,7 +38,182 @@ }; cfg = this.config; // extended config copy cfg cfg.id = 'ax5-modal-' + ax5.getGuid(); // instance id - + + var + onStateChanged = function (opts, that) { + if (opts && opts.onStateChanged) { + opts.onStateChanged.call(that, that); + } + else if (this.onStateChanged) { + this.onStateChanged.call(that, that); + } + return true; + }, + getContentTmpl = function () { + return ` +
+
+ {{#iframe}} +
+ +
+
+ + {{#param}} + {{#@each}} + + {{/@each}} + {{/param}} +
+ {{/iframe}} +
+
+ `; + }, + getContent = function (modalId, opts) { + var + data = { + modalId: modalId, + theme: opts.theme, + fullScreen: (opts.fullScreen ? "fullscreen" : ""), + styles: [], + iframe: opts.iframe + }; + + if (opts.zIndex) { + data.styles.push("z-index:" + opts.zIndex); + } + if (typeof data.iframe.param === "string") { + data.iframe.param = ax5.util.param(data.iframe.param); + } + + return ax5.mustache.render(getContentTmpl(), data); + }, + open = function (opts, callBack) { + var that; + + jQuery(document.body).append(getContent.call(this, opts.id, opts)); + + this.activeModal = jQuery('#' + opts.id); + + // 파트수집 + this.$ = { + "root": this.activeModal.find('[data-modal-els="root"]'), + "body": this.activeModal.find('[data-modal-els="body"]') + }; + + if (opts.iframe) { + this.$["iframe-wrap"] = this.activeModal.find('[data-modal-els="iframe-wrap"]'); + this.$["iframe"] = this.activeModal.find('[data-modal-els="iframe"]'); + this.$["iframe-form"] = this.activeModal.find('[data-modal-els="iframe-form"]'); + } + + //- position 정렬 + align.call(this); + + that = { + self: this, + id: opts.id, + theme: opts.theme, + width: opts.width, + height: opts.height, + state: "open", + $: this.$ + }; + + if (opts.iframe) { + + this.$["iframe-wrap"].css({height: opts.height}); + this.$["iframe"].css({height: opts.height}); + + // iframe content load + this.$["iframe-form"].attr({"method": opts.iframe.method}); + this.$["iframe-form"].attr({"target": opts.id + "-frame"}); + this.$["iframe-form"].attr({"action": opts.iframe.url}); + this.$["iframe"].on("load", (function () { + that.state = "load"; + onStateChanged.call(this, opts, that); + }).bind(this)); + this.$["iframe-form"].submit(); + } + + if (callBack) callBack.call(that); + onStateChanged.call(this, opts, that); + + // bind key event + if (opts.closeToEsc) { + jQuery(window).bind("keydown.ax-modal", (function (e) { + onkeyup.call(this, e || window.event); + }).bind(this)); + } + jQuery(window).bind("resize.ax-modal", (function (e) { + align.call(this, null, e || window.event); + }).bind(this)); + }, + align = function (position, e) { + if (!this.activeModal) return this; + var opts = self.modalConfig, + box = { + width: opts.width, + height: opts.height + }; + + if (opts.fullScreen) { + box.width = jQuery(window).width(); + box.height = jQuery(window).height(); + box.left = 0; + box.top = 0; + + if (opts.iframe) { + this.$["iframe-wrap"].css({height: box.height}); + this.$["iframe"].css({height: box.height}); + } + } + else { + if (position) { + jQuery.extend(true, opts.position, position); + } + + //- position 정렬 + if (opts.position.left == "left") { + box.left = (opts.position.margin || 0); + } + else if (opts.position.left == "right") { + // window.innerWidth; + box.left = jQuery(window).width() - box.width - (opts.position.margin || 0); + } + else if (opts.position.left == "center") { + box.left = jQuery(window).width() / 2 - box.width / 2; + } + else { + box.left = opts.position.left || 0; + } + + if (opts.position.top == "top") { + box.top = (opts.position.margin || 0); + } + else if (opts.position.top == "bottom") { + box.top = jQuery(window).height() - box.height - (opts.position.margin || 0); + } + else if (opts.position.top == "middle") { + box.top = jQuery(window).height() / 2 - box.height / 2; + } + else { + box.top = opts.position.top || 0; + } + } + + this.activeModal.css(box); + return this; + }, + onkeyup = function (e) { + if (e.keyCode == ax5.info.eventKeys.ESC) { + this.close(); + } + }; + + /// private end + /** * Preferences of modal UI * @method ax5.ui.modal.setConfig @@ -48,42 +223,20 @@ * ``` * ``` */ - //== class body start + //== class body start this.init = function () { this.onStateChanged = cfg.onStateChanged; }; - - this.getContent = function (modalId, opts) { - var - po = [], - styles = []; - - if(opts.zIndex){ - styles.push("z-index:" + opts.zIndex); - } - - po.push('
'); - po.push('
'); - // use iframe - if (opts.iframe) { - po.push('
'); - po.push(''); - po.push('
'); - po.push('
'); - po.push(''); - if(typeof opts.iframe.param === "string"){ - opts.iframe.param = ax5.util.param(opts.iframe.param); - } - for (var p in opts.iframe.param) { - po.push(''); - } - po.push('
'); - } - po.push('
'); - po.push('
'); - return po.join(''); - }; + /** + * open the modal + * @method ax5.ui.modal.open + * @returns {ax5.ui.modal} + * @example + * ``` + * my_modal.open(); + * ``` + */ this.open = function (opts, callBack) { if (U.isString(opts)) { opts = { @@ -97,146 +250,10 @@ jQuery.extend(true, self.modalConfig, opts); opts = self.modalConfig; - this._open(opts, callBack); + open.call(this, opts, callBack); return this; }; - this._open = function (opts, callBack) { - var - that; - - jQuery(document.body).append(this.getContent(opts.id, opts)); - - this.activeModal = jQuery('#' + opts.id); - - // 파트수집 - this.$ = { - "root": this.activeModal.find('[data-modal-els="root"]'), - "body": this.activeModal.find('[data-modal-els="body"]') - }; - - if (opts.iframe) { - this.$["iframe-wrap"] = this.activeModal.find('[data-modal-els="iframe-wrap"]'); - this.$["iframe"] = this.activeModal.find('[data-modal-els="iframe"]'); - this.$["iframe-form"] = this.activeModal.find('[data-modal-els="iframe-form"]'); - } - - //- position 정렬 - this.align(); - - that = { - self: this, - id: opts.id, - theme: opts.theme, - width: opts.width, - height: opts.height, - state: "open", - $: this.$ - }; - - if (opts.iframe) { - - this.$["iframe-wrap"].css({height: opts.height}); - this.$["iframe"].css({height: opts.height}); - - // iframe content load - this.$["iframe-form"].attr({"method": opts.iframe.method}); - this.$["iframe-form"].attr({"target": opts.id + "-frame"}); - this.$["iframe-form"].attr({"action": opts.iframe.url}); - this.$["iframe"].on("load", (function () { - that.state = "load"; - if (opts && opts.onStateChanged) { - opts.onStateChanged.call(that, that); - } - else if (this.onStateChanged) { - this.onStateChanged.call(that, that); - } - }).bind(this)); - this.$["iframe-form"].submit(); - } - - if (callBack) callBack.call(that); - if (opts && opts.onStateChanged) { - opts.onStateChanged.call(that, that); - } - else if (this.onStateChanged) { - this.onStateChanged.call(that, that); - } - - // bind key event - if (opts.closeToEsc) { - jQuery(window).bind("keydown.ax-modal", (function (e) { - this.onkeyup(e || window.event); - }).bind(this)); - } - jQuery(window).bind("resize.ax-modal", (function (e) { - this.align(null, e || window.event); - }).bind(this)); - }; - - this.align = function (position, e) { - if (!this.activeModal) return this; - var opts = self.modalConfig, - box = { - width: opts.width, - height: opts.height - }; - - if(opts.fullScreen){ - box.width = jQuery(window).width(); - box.height = jQuery(window).height(); - box.left = 0; - box.top = 0; - - if (opts.iframe) { - this.$["iframe-wrap"].css({height: box.height}); - this.$["iframe"].css({height: box.height}); - } - } - else{ - if (position) { - jQuery.extend(true, opts.position, position); - } - - //- position 정렬 - if (opts.position.left == "left") { - box.left = (opts.position.margin || 0); - } - else if (opts.position.left == "right") { - // window.innerWidth; - box.left = jQuery(window).width() - box.width - (opts.position.margin || 0); - } - else if (opts.position.left == "center") { - box.left = jQuery(window).width() / 2 - box.width / 2; - } - else { - box.left = opts.position.left || 0; - } - - if (opts.position.top == "top") { - box.top = (opts.position.margin || 0); - } - else if (opts.position.top == "bottom") { - box.top = jQuery(window).height() - box.height - (opts.position.margin || 0); - } - else if (opts.position.top == "middle") { - box.top = jQuery(window).height() / 2 - box.height / 2; - } - else { - box.top = opts.position.top || 0; - } - } - - this.activeModal.css(box); - return this; - }; - - this.onkeyup = function (e) { - if (e.keyCode == ax5.info.eventKeys.ESC) { - this.close(); - } - }; - /** * close the modal * @method ax5.ui.modal.close @@ -260,12 +277,10 @@ self: this, state: "close" }; - if (opts && opts.onStateChanged) { - opts.onStateChanged.call(that, that); - } - else if (this.onStateChanged) { - this.onStateChanged.call(that, that); - } + onStateChanged.call(this, opts, { + self: this, + state: "close" + }); }).bind(this), cfg.animateTime); } return this; @@ -285,7 +300,7 @@ } if (css.height) { self.modalConfig.height = this.activeModal.height(); - if(this.$["iframe"]) { + if (this.$["iframe"]) { this.$["iframe-wrap"].css({height: self.modalConfig.height}); this.$["iframe"].css({height: self.modalConfig.height}); } @@ -296,16 +311,16 @@ // 클래스 생성자 this.main = (function () { - if(arguments && U.isObject(arguments[0])) { + if (arguments && U.isObject(arguments[0])) { this.setConfig(arguments[0]); } }).apply(this, arguments); }; //== UI Class - root.modal = (function(){ + root.modal = (function () { if (U.isFunction(_SUPER_)) axClass.prototype = new _SUPER_(); // 상속 return axClass; })(); // ax5.ui에 연결 - + })(ax5.ui, ax5.ui.root); \ No newline at end of file