Skip to content

Commit

Permalink
add attr side-close-on-outside-click
Browse files Browse the repository at this point in the history
  • Loading branch information
@taobataoma
taobataoma committed Jun 30, 2017
1 parent d8ec083 commit 74fe296
Show file tree
Hide file tree
Showing 5 changed files with 71 additions and 20 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": "angular-side-overlay",
"version": "1.0.0",
"version": "1.0.1",
"homepage": "https://github.com/taobataoma/angular-side-overlay",
"repository": {
"type": "git",
Expand Down
41 changes: 33 additions & 8 deletions dist/angular-side-overlay.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
* @license MIT
*/
angular.module('ngSideOverlay', []);
angular.module('ngSideOverlay').constant('MODULE_VERSION', '1.0.0');
angular.module('ngSideOverlay').constant('MODULE_VERSION', '1.0.1');
angular.module('ngSideOverlay').value('sideCallbackEvent', [
{
id: undefined,
Expand All @@ -19,7 +19,7 @@ angular.module('ngSideOverlay').value('sideCallbackEvent', [
angular.module('ngSideOverlay').provider('SideOverlay', function () {
this.$get = ["sideCallbackEvent", function (sideCallbackEvent) {
//method open
var open = function (id, cb) {
var open = function (evt, id, cb) {
if (!id) {
return;
}
Expand All @@ -34,10 +34,15 @@ angular.module('ngSideOverlay').provider('SideOverlay', function () {
if (bg) {
bg.css('display', 'block');
}

if (evt && typeof evt.altKey !== "undefined") {
evt.stopPropagation();
evt.preventDefault();
}
};

//method close
var close = function (id, cb) {
var close = function (evt, id, cb) {
if (!id) {
return;
}
Expand All @@ -47,6 +52,11 @@ angular.module('ngSideOverlay').provider('SideOverlay', function () {
if (e.hasClass('side-visible')) {
e.removeClass('side-visible');
}

if (evt && typeof evt.altKey !== "undefined") {
evt.stopPropagation();
evt.preventDefault();
}
};

//get status
Expand Down Expand Up @@ -88,8 +98,7 @@ angular.module('ngSideOverlay').provider('SideOverlay', function () {
close: close
};
}];
})
;
});

angular.module('ngSideOverlay').directive('sideOverlay', sideOverlay);
sideOverlay.$inject = ['sideCallbackEvent'];
Expand Down Expand Up @@ -139,7 +148,7 @@ function sideOverlay(sideCallbackEvent) {
}
});

//overlay class
//sideModal
scope.$watch(attrs.sideModal, function (s) {
if (attrs.hasOwnProperty('sideModal')) {
var id = 'sideBackground_' + element.attr('id');
Expand All @@ -148,14 +157,25 @@ function sideOverlay(sideCallbackEvent) {
}
});

//sideCloseOnOutsideClick
scope.$watch(attrs.sideCloseOnOutsideClick, function (s) {
if (attrs.hasOwnProperty('sideCloseOnOutsideClick')) {
$(document.body).on('click', function (e) {
if (element.hasClass('side-visible')) {
element.removeClass('side-visible');
}
});
}
});

//overlay class
scope.$watch(attrs.sideClass, function (s) {
if (attrs.sideClass) {
element.addClass(attrs.sideClass);
}
});

//document keydown
//document keydown (ESC close)
scope.$watch(attrs.sideCloseOnEsc, function (s) {
if (attrs.hasOwnProperty('sideCloseOnEsc')) {
$(document).on('keydown', function (e) {
Expand All @@ -167,8 +187,13 @@ function sideOverlay(sideCallbackEvent) {
});
}
});
//sideOpened & sideClosed event
element.bind('click', function (evt) {
evt.stopPropagation();
evt.preventDefault();
});

//sideOpened & sideClosed
//sideOpened & sideClosed event
element.bind('webkitTransitionEnd oTransitionEnd otransitionend transitionend msTransitionEnd', function (evt) {
var e = angular.element(evt.target);
var bg = $('#sideBackground_' + element.attr('id'));
Expand Down
2 changes: 1 addition & 1 deletion dist/angular-side-overlay.min.js
View file

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

5 changes: 3 additions & 2 deletions package.json
View file
Original file line number Diff line number Diff line change
@@ -1,9 +1,10 @@
{
"name": "angular-side-overlay",
"version": "1.0.0",
"version": "1.0.1",
"description": "angular side overlay component",
"scripts": {
"test": "npm test"
"test": "npm test",
"build": "gulp build"
},
"repository": {
"type": "git",
Expand Down
41 changes: 33 additions & 8 deletions src/angular-side-overlay.js
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
angular.module('ngSideOverlay', []);
angular.module('ngSideOverlay').constant('MODULE_VERSION', '1.0.0');
angular.module('ngSideOverlay').constant('MODULE_VERSION', '1.0.1');
angular.module('ngSideOverlay').value('sideCallbackEvent', [
{
id: undefined,
Expand All @@ -12,7 +12,7 @@ angular.module('ngSideOverlay').value('sideCallbackEvent', [
angular.module('ngSideOverlay').provider('SideOverlay', function () {
this.$get = function (sideCallbackEvent) {
//method open
var open = function (id, cb) {
var open = function (evt, id, cb) {
if (!id) {
return;
}
Expand All @@ -27,10 +27,15 @@ angular.module('ngSideOverlay').provider('SideOverlay', function () {
if (bg) {
bg.css('display', 'block');
}

if (evt && typeof evt.altKey !== "undefined") {
evt.stopPropagation();
evt.preventDefault();
}
};

//method close
var close = function (id, cb) {
var close = function (evt, id, cb) {
if (!id) {
return;
}
Expand All @@ -40,6 +45,11 @@ angular.module('ngSideOverlay').provider('SideOverlay', function () {
if (e.hasClass('side-visible')) {
e.removeClass('side-visible');
}

if (evt && typeof evt.altKey !== "undefined") {
evt.stopPropagation();
evt.preventDefault();
}
};

//get status
Expand Down Expand Up @@ -81,8 +91,7 @@ angular.module('ngSideOverlay').provider('SideOverlay', function () {
close: close
};
};
})
;
});

angular.module('ngSideOverlay').directive('sideOverlay', sideOverlay);
sideOverlay.$inject = ['sideCallbackEvent'];
Expand Down Expand Up @@ -132,7 +141,7 @@ function sideOverlay(sideCallbackEvent) {
}
});

//overlay class
//sideModal
scope.$watch(attrs.sideModal, function (s) {
if (attrs.hasOwnProperty('sideModal')) {
var id = 'sideBackground_' + element.attr('id');
Expand All @@ -141,14 +150,25 @@ function sideOverlay(sideCallbackEvent) {
}
});

//sideCloseOnOutsideClick
scope.$watch(attrs.sideCloseOnOutsideClick, function (s) {
if (attrs.hasOwnProperty('sideCloseOnOutsideClick')) {
$(document.body).on('click', function (e) {
if (element.hasClass('side-visible')) {
element.removeClass('side-visible');
}
});
}
});

//overlay class
scope.$watch(attrs.sideClass, function (s) {
if (attrs.sideClass) {
element.addClass(attrs.sideClass);
}
});

//document keydown
//document keydown (ESC close)
scope.$watch(attrs.sideCloseOnEsc, function (s) {
if (attrs.hasOwnProperty('sideCloseOnEsc')) {
$(document).on('keydown', function (e) {
Expand All @@ -160,8 +180,13 @@ function sideOverlay(sideCallbackEvent) {
});
}
});
//sideOpened & sideClosed event
element.bind('click', function (evt) {
evt.stopPropagation();
evt.preventDefault();
});

//sideOpened & sideClosed
//sideOpened & sideClosed event
element.bind('webkitTransitionEnd oTransitionEnd otransitionend transitionend msTransitionEnd', function (evt) {
var e = angular.element(evt.target);
var bg = $('#sideBackground_' + element.attr('id'));
Expand Down

0 comments on commit 74fe296

Please sign in to comment.