API.md

ax5modal

Kind: global class
Author: [email protected]

• ax5modal
  • .setConfig(config) ⇒ ax5modal
  • .open() ⇒ ax5modal
  • .close(_option) ⇒ ax5modal
  • .minimize() ⇒ ax5modal
  • .restore() ⇒ ax5modal
  • .css(css) ⇒ ax5modal
  • .setModalConfig(_config) ⇒ ax5.ui.ax5modal
  • .align(position, e) ⇒ ax5modal

ax5modal.setConfig(config) ⇒ ax5modal

Preferences of modal UI

Kind: static method of ax5modal

Param	Type	Default	Description
config	Object		클래스 속성값
[config.zIndex]	Number
[config.position]	Object
[config.position.left]	String	"center"
[config.position.top]	String	"middle"
[config.position.margin]	Number	10
[config.minimizePosition]	String	"bottom-right"
[config.width]	Number	300
[config.height]	Number	400
[config.closeToEsc]	Boolean	true
[config.absolute]	Boolean	false
[config.disableDrag]	Boolean	false
[config.disableResize]	Boolean	false
[config.animateTime]	Number	250
[config.fullScreen]	function
[config.onStateChanged]	function		onStateChanged function can be defined in setConfig method or new ax5.ui.modal initialization method. However, you can us to define an event function after initialization, if necessary
[config.onResize]	function

Example

var modal = new ax5.ui.modal({
    iframeLoadingMsg: '<i class="fa fa-spinner fa-5x fa-spin" aria-hidden="true"></i>',
    header: {
        title: "MODAL TITLE",
        btns: {
            minimize: {
                label: '<i class="fa fa-minus-circle" aria-hidden="true"></i>', onClick: function () {
                    modal.minimize();
                }
            },
            maximize: {
                label: '<i class="fa fa-plus-circle" aria-hidden="true"></i>', onClick: function () {
                    modal.maximize();
                }
            },
            close: {
                label: '<i class="fa fa-times-circle" aria-hidden="true"></i>', onClick: function () {
                    modal.close();
                }
            }
        }
    }
});

modal.open({
    width: 800,
    height: 600,
    fullScreen: function(){
        return ($(window).width() < 600);
    },
    iframe: {
        method: "get",
        url: "http://chequer-app:2017/html/login.html",
        param: "callback=modalCallback"
    },
    onStateChanged: function(){
         console.log(this);
    },
    onResize: function(){
         console.log(this);
    }
});

ax5modal.open() ⇒ ax5modal

open the modal

Kind: static method of ax5modal
Example

modal.open();
modal.open({
 width: 500,
 height: 500
});
moaal.open({}, function(){
 console.log(this);
});

ax5modal.close(_option) ⇒ ax5modal

close the modal

Kind: static method of ax5modal

Param
_option

Example

my_modal.close();
my_modal.close({callback: function(){
 // on close event
});
// close 함수에 callback을 전달하면 정확한 close 타이밍을 캐치할 수 있습니다

ax5modal.minimize() ⇒ ax5modal

Kind: static method of ax5modal

ax5modal.restore() ⇒ ax5modal

Kind: static method of ax5modal

ax5modal.css(css) ⇒ ax5modal

setCSS

Kind: static method of ax5modal

Param	Type	Description
css	Object	-

ax5modal.setModalConfig(_config) ⇒ ax5.ui.ax5modal

Kind: static method of ax5modal

Param
_config

ax5modal.align(position, e) ⇒ ax5modal

Kind: static method of ax5modal

Param
position
e

Example

modal.align({left:"center", top:"middle"});
modal.align({left:"left", top:"top", margin: 20});