Skip to content

Commit

Permalink
[email protected]
Browse files Browse the repository at this point in the history
  • Loading branch information
@thomasJang
thomasJang committed Apr 4, 2016
1 parent fe3842c commit 6ca1568
Show file tree
Hide file tree
Showing 5 changed files with 317 additions and 352 deletions.
2 changes: 1 addition & 1 deletion bower.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "ax5ui-dialog",
"version": "0.6.4",
"version": "0.6.5",
"authors": [
"ThomasJ <[email protected]>"
],
Expand Down
319 changes: 151 additions & 168 deletions dist/ax5dialog.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
/**
* @class ax5.ui.dialog
* @classdesc
* @version 0.6.4
* @version 0.6.5
* @author [email protected]
* @example
* ```
Expand Down Expand Up @@ -60,6 +60,150 @@
}
};
return ax5.mustache.render(getContentTmpl(), data);
},
open = function open(opts, callBack) {
var pos = {},
box;

opts.id = opts.id || cfg.id;

box = {
width: opts.width
};
jQuery(document.body).append(getContent.call(this, opts.id, opts));

this.activeDialog = jQuery('#' + opts.id);
this.activeDialog.css({ width: box.width });

// dialog 높이 구하기 - 너비가 정해지면 높이가 변경 될 것.
opts.height = box.height = this.activeDialog.height();

//- position 정렬
if (typeof opts.position === "undefined" || opts.position === "center") {
pos.top = jQuery(window).height() / 2 - box.height / 2;
pos.left = jQuery(window).width() / 2 - box.width / 2;
} else {
pos.left = opts.position.left || 0;
pos.top = opts.position.top || 0;
}
this.activeDialog.css(pos);

// bind button event
if (opts.dialogType === "prompt") {
this.activeDialog.find("[data-dialog-prompt]").get(0).focus();
} else {
this.activeDialog.find("[data-dialog-btn]").get(0).focus();
}

this.activeDialog.find("[data-dialog-btn]").on(cfg.clickEventName, function (e) {
btnOnClick.call(this, e || window.event, opts, callBack);
}.bind(this));

// bind key event
jQuery(window).bind("keydown.ax5dialog", function (e) {
onKeyup.call(this, e || window.event, opts, callBack);
}.bind(this));

jQuery(window).bind("resize.ax5dialog", function (e) {
align.call(this, e || window.event);
}.bind(this));

onStateChanged.call(this, opts, {
self: this,
state: "open"
});
},
align = function align(e) {
if (!this.activeDialog) return this;
var opts = self.dialogConfig,
box = {
width: opts.width,
height: opts.height
};
//- position 정렬
if (typeof opts.position === "undefined" || opts.position === "center") {
box.top = window.innerHeight / 2 - box.height / 2;
box.left = window.innerWidth / 2 - box.width / 2;
} else {
box.left = opts.position.left || 0;
box.top = opts.position.top || 0;
}
this.activeDialog.css(box);
return this;
},
btnOnClick = function btnOnClick(e, opts, callBack, target, k) {
if (e.srcElement) e.target = e.srcElement;

target = U.findParentNode(e.target, function (target) {
if (target.getAttribute("data-dialog-btn")) {
return true;
}
});

if (target) {
k = target.getAttribute("data-dialog-btn");

var that = {
self: this,
key: k, value: opts.btns[k],
dialogId: opts.id,
btnTarget: target
};
if (opts.dialogType === "prompt") {
var emptyKey = null;
for (var oi in opts.input) {
that[oi] = this.activeDialog.find('[data-dialog-prompt=' + oi + ']').val();
if (that[oi] == "" || that[oi] == null) {
emptyKey = oi;
break;
}
}
}
if (opts.btns[k].onClick) {
opts.btns[k].onClick.call(that, k);
} else if (opts.dialogType === "alert") {
if (callBack) callBack.call(that, k);
this.close();
} else if (opts.dialogType === "confirm") {
if (callBack) callBack.call(that, k);
this.close();
} else if (opts.dialogType === "prompt") {
if (k === 'ok') {
if (emptyKey) {
this.activeDialog.find('[data-dialog-prompt="' + emptyKey + '"]').get(0).focus();
return false;
}
}
if (callBack) callBack.call(that, k);
this.close();
}
}
},
onKeyup = function onKeyup(e, opts, callBack, target, k) {
if (e.keyCode == ax5.info.eventKeys.ESC) {
this.close();
}
if (opts.dialogType === "prompt") {
if (e.keyCode == ax5.info.eventKeys.RETURN) {
var that = {
self: this,
key: k, value: opts.btns[k],
dialogId: opts.id,
btnTarget: target
};
var emptyKey = null;
for (var oi in opts.input) {
that[oi] = this.activeDialog.find('[data-dialog-prompt=' + oi + ']').val();
if (that[oi] == "" || that[oi] == null) {
emptyKey = oi;
break;
}
}
if (emptyKey) return false;
if (callBack) callBack.call(that, k);
this.close();
}
}
};

/**
Expand Down Expand Up @@ -106,8 +250,7 @@
}

self.dialogConfig = {};
jQuery.extend(true, self.dialogConfig, cfg);
jQuery.extend(true, self.dialogConfig, opts);
jQuery.extend(true, self.dialogConfig, cfg, opts);
opts = self.dialogConfig;

opts.dialogType = "alert";
Expand All @@ -116,7 +259,7 @@
ok: { label: cfg.lang["ok"], theme: opts.theme }
};
}
this.open(opts, callBack);
open.call(this, opts, callBack);
return this;
};

Expand Down Expand Up @@ -148,8 +291,7 @@
}

self.dialogConfig = {};
jQuery.extend(true, self.dialogConfig, cfg);
jQuery.extend(true, self.dialogConfig, opts);
jQuery.extend(true, self.dialogConfig, cfg, opts);
opts = self.dialogConfig;

opts.dialogType = "confirm";
Expand All @@ -160,7 +302,7 @@
cancel: { label: cfg.lang["cancel"] }
};
}
this.open(opts, callBack);
open.call(this, opts, callBack);
return this;
};

Expand Down Expand Up @@ -192,8 +334,7 @@
}

self.dialogConfig = {};
jQuery.extend(true, self.dialogConfig, cfg);
jQuery.extend(true, self.dialogConfig, opts);
jQuery.extend(true, self.dialogConfig, cfg, opts);
opts = self.dialogConfig;

opts.dialogType = "prompt";
Expand All @@ -210,168 +351,10 @@
cancel: { label: cfg.lang["cancel"] }
};
}
this.open(opts, callBack);
open.call(this, opts, callBack);
return this;
};

this.open = function (opts, callBack) {
var pos = {},
that,
box;

opts.id = opts.id || cfg.id;

box = {
width: opts.width
};
jQuery(document.body).append(getContent.call(this, opts.id, opts));

this.activeDialog = jQuery('#' + opts.id);
this.activeDialog.css({ width: box.width });

// dialog 높이 구하기 - 너비가 정해지면 높이가 변경 될 것.
opts.height = box.height = this.activeDialog.height();

//- position 정렬
if (typeof opts.position === "undefined" || opts.position === "center") {
var w = window.innerWidth;
var h = window.innerHeight;

pos.top = h / 2 - box.height / 2;
pos.left = w / 2 - box.width / 2;
} else {
pos.left = opts.position.left || 0;
pos.top = opts.position.top || 0;
}
this.activeDialog.css(pos);

// bind button event
if (opts.dialogType === "prompt") {
this.activeDialog.find("[data-dialog-prompt]").get(0).focus();
} else {
this.activeDialog.find("[data-dialog-btn]").get(0).focus();
}

this.activeDialog.find("[data-dialog-btn]").on(cfg.clickEventName, function (e) {
this.btnOnClick(e || window.event, opts, callBack);
}.bind(this));

// bind key event
jQuery(window).bind("keydown.ax5dialog", function (e) {
this.onKeyup(e || window.event, opts, callBack);
}.bind(this));

jQuery(window).bind("resize.ax5dialog", function (e) {
this.align(e || window.event);
}.bind(this));

that = {
self: this,
state: "open"
};
if (opts && opts.onStateChanged) {
opts.onStateChanged.call(that, that);
} else if (this.onStateChanged) {
this.onStateChanged.call(that, that);
}
return this;
};

this.align = function (e) {
if (!this.activeDialog) return this;
var opts = self.dialogConfig,
box = {
width: opts.width,
height: opts.height
};
//- position 정렬
if (typeof opts.position === "undefined" || opts.position === "center") {
box.top = window.innerHeight / 2 - box.height / 2;
box.left = window.innerWidth / 2 - box.width / 2;
} else {
box.left = opts.position.left || 0;
box.top = opts.position.top || 0;
}
this.activeDialog.css(box);
return this;
};

this.btnOnClick = function (e, opts, callBack, target, k) {
if (e.srcElement) e.target = e.srcElement;

target = U.findParentNode(e.target, function (target) {
if (target.getAttribute("data-dialog-btn")) {
return true;
}
});

if (target) {
k = target.getAttribute("data-dialog-btn");

var that = {
self: this,
key: k, value: opts.btns[k],
dialogId: opts.id,
btnTarget: target
};
if (opts.dialogType === "prompt") {
var emptyKey = null;
for (var oi in opts.input) {
that[oi] = this.activeDialog.find('[data-dialog-prompt=' + oi + ']').val();
if (that[oi] == "" || that[oi] == null) {
emptyKey = oi;
break;
}
}
}
if (opts.btns[k].onClick) {
opts.btns[k].onClick.call(that, k);
} else if (opts.dialogType === "alert") {
if (callBack) callBack.call(that, k);
this.close();
} else if (opts.dialogType === "confirm") {
if (callBack) callBack.call(that, k);
this.close();
} else if (opts.dialogType === "prompt") {
if (k === 'ok') {
if (emptyKey) {
this.activeDialog.find('[data-dialog-prompt="' + emptyKey + '"]').get(0).focus();
return false;
}
}
if (callBack) callBack.call(that, k);
this.close();
}
}
};

this.onKeyup = function (e, opts, callBack, target, k) {
if (e.keyCode == ax5.info.eventKeys.ESC) {
this.close();
}
if (opts.dialogType === "prompt") {
if (e.keyCode == ax5.info.eventKeys.RETURN) {
var that = {
self: this,
key: k, value: opts.btns[k],
dialogId: opts.id,
btnTarget: target
};
var emptyKey = null;
for (var oi in opts.input) {
that[oi] = this.activeDialog.find('[data-dialog-prompt=' + oi + ']').val();
if (that[oi] == "" || that[oi] == null) {
emptyKey = oi;
break;
}
}
if (emptyKey) return false;
if (callBack) callBack.call(that, k);
this.close();
}
}
};

/**
* close the dialog
* @method ax5.ui.dialog.close
Expand Down
Loading

0 comments on commit 6ca1568

Please sign in to comment.