Skip to content

Commit

Permalink
[email protected] Improve modal move action
Browse files Browse the repository at this point in the history
  • Loading branch information
thomasJang committed Oct 3, 2016
1 parent 912ca2e commit b356279
Show file tree
Hide file tree
Showing 8 changed files with 86 additions and 63 deletions.
2 changes: 1 addition & 1 deletion bower.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "ax5ui-modal",
"version": "0.7.9",
"version": "0.8.0",
"authors": [
"ThomasJ <[email protected]>"
],
Expand Down
2 changes: 1 addition & 1 deletion dist/ax5modal.css

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

19 changes: 14 additions & 5 deletions dist/ax5modal.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@

UI.addClass({
className: "modal",
version: "0.7.9"
version: "0.8.0"
}, function () {
/**
* @class ax5modal
Expand Down Expand Up @@ -83,7 +83,7 @@
margin: 10
},
minimizePosition: "bottom-right",
clickEventName: "mousedown", //(('ontouchstart' in document.documentElement) ? "touchstart" : "click"),
clickEventName: "click", //(('ontouchstart' in document.documentElement) ? "touchstart" : "click"),
theme: 'default',
width: 300,
height: 400,
Expand Down Expand Up @@ -195,8 +195,17 @@
}.bind(this));

this.$.header.bind(ENM["mousedown"], function (e) {
self.mousePosition = getMousePosition(e);
moveModal.on.call(self);
/// 이벤트 필터링 추가 : 버튼엘리먼트로 부터 발생된 이벤트이면 moveModal 시작하지 않도록 필터링
var isButton = U.findParentNode(e.target, function (_target) {
if (_target.getAttribute("data-modal-header-btn")) {
return true;
}
});

if (!isButton) {
self.mousePosition = getMousePosition(e);
moveModal.on.call(self);
}
}).bind("dragstart", function (e) {
U.stopEvent(e);
return false;
Expand Down Expand Up @@ -590,7 +599,7 @@
var MODAL = ax5.ui.modal;

var content = function content() {
return " \n <div id=\"{{modalId}}\" data-modal-els=\"root\" class=\"ax5modal {{theme}} {{fullscreen}}\" style=\"{{styles}}\">\n {{#header}}\n <div class=\"ax-modal-header\" data-modal-els=\"header\">\n {{{title}}}\n {{#btns}}\n <div class=\"ax-modal-header-addon\">\n {{#@each}}\n <a tabindex=\"-1\" data-modal-header-btn=\"{{@key}}\" class=\"{{@value.theme}}\">{{{@value.label}}}</a>\n {{/@each}}\n </div>\n {{/btns}}\n </div>\n {{/header}}\n <div class=\"ax-modal-body\" data-modal-els=\"body\">\n {{#iframe}}\n \n <div data-modal-els=\"iframe-wrap\" style=\"-webkit-overflow-scrolling: touch; overflow: auto;position: relative;\">\n <table data-modal-els=\"iframe-loading\" style=\"width:100%;height:100%;\"><tr><td style=\"text-align: center;vertical-align: middle\">{{{iframeLoadingMsg}}}</td></tr></table>\n <iframe name=\"{{modalId}}-frame\" src=\"\" width=\"100%\" height=\"100%\" frameborder=\"0\" data-modal-els=\"iframe\" style=\"position: absolute;left:0;top:0;\"></iframe>\n </div>\n <form name=\"{{modalId}}-form\" data-modal-els=\"iframe-form\">\n <input type=\"hidden\" name=\"modalId\" value=\"{{modalId}}\" />\n {{#param}}\n {{#@each}}\n <input type=\"hidden\" name=\"{{@key}}\" value=\"{{@value}}\" />\n {{/@each}}\n {{/param}}\n </form>\n {{/iframe}}\n </div>\n </div>\n ";
return " \n <div id=\"{{modalId}}\" data-modal-els=\"root\" class=\"ax5modal {{theme}} {{fullscreen}}\" style=\"{{styles}}\">\n {{#header}}\n <div class=\"ax-modal-header\" data-modal-els=\"header\">\n {{{title}}}\n {{#btns}}\n <div class=\"ax-modal-header-addon\">\n {{#@each}}\n <button tabindex=\"-1\" data-modal-header-btn=\"{{@key}}\" class=\"{{@value.theme}}\">{{{@value.label}}}</button>\n {{/@each}}\n </div>\n {{/btns}}\n </div>\n {{/header}}\n <div class=\"ax-modal-body\" data-modal-els=\"body\">\n {{#iframe}}\n \n <div data-modal-els=\"iframe-wrap\" style=\"-webkit-overflow-scrolling: touch; overflow: auto;position: relative;\">\n <table data-modal-els=\"iframe-loading\" style=\"width:100%;height:100%;\"><tr><td style=\"text-align: center;vertical-align: middle\">{{{iframeLoadingMsg}}}</td></tr></table>\n <iframe name=\"{{modalId}}-frame\" src=\"\" width=\"100%\" height=\"100%\" frameborder=\"0\" data-modal-els=\"iframe\" style=\"position: absolute;left:0;top:0;\"></iframe>\n </div>\n <form name=\"{{modalId}}-form\" data-modal-els=\"iframe-form\">\n <input type=\"hidden\" name=\"modalId\" value=\"{{modalId}}\" />\n {{#param}}\n {{#@each}}\n <input type=\"hidden\" name=\"{{@key}}\" value=\"{{@value}}\" />\n {{/@each}}\n {{/param}}\n </form>\n {{/iframe}}\n </div>\n <div class=\"ax-modal-body-mask\"></div>\n </div>\n ";
};

MODAL.tmpl = {
Expand Down
Loading

0 comments on commit b356279

Please sign in to comment.