Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

different speeds on open and close #178

Open
wants to merge 48 commits into
base: v2
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
48 commits
Select commit Hold shift + click to select a range
9759ca4
Merge pull request #123 from dpiccone/v2
danielepiccone Jul 16, 2016
b25af6b
2.0.0
danielepiccone Jul 16, 2016
103fb95
peerDependencies should be in package.json
danielepiccone Jul 16, 2016
d214484
2.0.1
danielepiccone Jul 16, 2016
465c462
add npm install to readme
ttbarnes Jul 28, 2016
0c9e80f
fix some indentation in readme
ttbarnes Jul 28, 2016
bfe10d0
Merge pull request #126 from ttbarnes/readme-npm
danielepiccone Aug 2, 2016
891b99b
Adding npm run examples
danielepiccone Aug 2, 2016
3a6d080
Fixed misleading behaviour of ps-container, new examples
danielepiccone Aug 2, 2016
85f7948
Fixed tests related to ps-container
danielepiccone Aug 3, 2016
425d414
Updated peer dependencies to 1.5.x
danielepiccone Aug 3, 2016
a0641ad
2.1.0
danielepiccone Aug 3, 2016
5fc1d4d
feat mobile-support: include touchend event in clickOutside check
Aug 30, 2016
364cb42
Merge pull request #135 from jwhitmarsh/feat/mobile-support
danielepiccone Sep 6, 2016
8fb9760
Angular version 1.5.x in bower
danielepiccone Sep 6, 2016
33334b2
build
danielepiccone Sep 6, 2016
868df4d
2.1.1
danielepiccone Sep 6, 2016
5261ec1
Fixes issue where when using Bootstrap Modals, multiple ng-pageslide…
Dec 1, 2016
60781d2
right pad className only if needed
danielepiccone Dec 3, 2016
6b8ed0f
2.1.2
danielepiccone Dec 3, 2016
d6f102a
missing dep grunt-cli
danielepiccone Dec 3, 2016
0e19530
Test for #149
danielepiccone Dec 3, 2016
e534e15
onclose & onopen as angular exec
miguelrjim Nov 14, 2016
e472ee3
Using onopen & onclose as variables
miguelrjim Nov 14, 2016
1521a9c
running grunt
miguelrjim Nov 14, 2016
6aaa17a
Missing typeof
danielepiccone Dec 3, 2016
86cb6af
prepublish hook
danielepiccone Dec 3, 2016
2b06869
New build
danielepiccone Dec 3, 2016
a084d18
2.1.3
danielepiccone Dec 3, 2016
6a3c8c9
Fixes #140 click outside in mobile safari
danielepiccone Dec 3, 2016
165d32d
Really use onclose onopen function in their context
danielepiccone Dec 3, 2016
41af016
user scope instead of $scope to identify the isolated scope
danielepiccone Dec 3, 2016
9e1f84f
Move autoClose param on top
danielepiccone Dec 10, 2016
1c33135
Adding missing dev dev [email protected]
danielepiccone Dec 10, 2016
fde80fc
Fixes #151 adding extra check for body.contains(target)
danielepiccone Dec 10, 2016
4160e3b
build
danielepiccone Dec 10, 2016
ec8a042
2.1.4
danielepiccone Dec 10, 2016
c0c8aa2
updates tests, and dependencies, peer to angular 1.x
danielepiccone Dec 5, 2017
609a2c5
adds a package-lock.json
danielepiccone Dec 5, 2017
3c36be3
updates git refs
danielepiccone Dec 5, 2017
8ac10ed
2.1.5
danielepiccone Dec 5, 2017
1f01ab7
updates readme
danielepiccone Dec 5, 2017
e72143f
update dependecies
danielepiccone Mar 19, 2018
fad8f17
new dist
danielepiccone Mar 27, 2018
2fa5c29
Update initSlider function, initialize according to psOpen state
danielepiccone Mar 28, 2018
dd90ca0
new dist
danielepiccone Mar 28, 2018
586f72f
2.1.6
danielepiccone Mar 28, 2018
f08b5da
2.2.0
danielepiccone Mar 28, 2018
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions .npmrc
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
package-lock=true
31 changes: 17 additions & 14 deletions bower.json
Original file line number Diff line number Diff line change
Expand Up @@ -10,21 +10,24 @@
"type": "git",
"url": "[email protected]:dpiccone/ng-pageslide.git"
},
"peerDependencies": {
"angular": "1.5.5"
"dependencies": {
"angular": "1.x"
},
"devDependencies": {
"grunt": "0.4.5",
"grunt-contrib-concat": "0.3.0",
"grunt-contrib-jshint": "0.6.5",
"grunt-contrib-uglify": "0.2.7",
"jasmine-core": "2.4.1",
"karma": "0.13.22",
"karma-coverage": "0.5.5",
"karma-coveralls": "1.1.2",
"karma-jasmine": "0.3.8",
"angular-mocks": "1.5.5",
"grunt-karma": "0.12.2",
"karma-phantomjs-launcher": "1.0.1"
"angular": "1.x",
"angular-mocks": "1.x",
"grunt": "^1.0.2",
"grunt-cli": "^1.2.0",
"grunt-contrib-concat": "^1.0.1",
"grunt-contrib-jshint": "^1.1.0",
"grunt-contrib-uglify": "^3.3.0",
"grunt-karma": "^2.0.0",
"http-server": "^0.11.1",
"jasmine-core": "^3.1.0",
"karma": "^2.0.0",
"karma-coverage": "^1.1.1",
"karma-coveralls": "^1.1.2",
"karma-jasmine": "^1.1.1",
"karma-phantomjs-launcher": "^1.0.4"
}
}
130 changes: 73 additions & 57 deletions dist/angular-pageslide-directive.js
Original file line number Diff line number Diff line change
Expand Up @@ -31,23 +31,26 @@
psKeyListener: '@',
psBodyClass: '@',
psClickOutside: '@',
onopen: '=?',
onclose: '=?'
onopen: '&?',
onclose: '&?'
},
link: function ($scope, el, attrs) {
link: function (scope, el, attrs) {

var param = {};

param.side = $scope.psSide || 'right';
param.speed = $scope.psSpeed || '0.5';
param.size = $scope.psSize || '300px';
param.zindex = $scope.psZindex || 1000;
param.className = $scope.psClass || 'ng-pageslide';
param.push = $scope.psPush === 'true';
param.container = $scope.psContainer || false;
param.keyListener = $scope.psKeyListener === 'true';
param.bodyClass = $scope.psBodyClass || false;
param.clickOutside = $scope.psClickOutside !== 'false';
param.side = scope.psSide || 'right';
param.speed = scope.psSpeed || '0.5';
param.size = scope.psSize || '300px';
param.zindex = scope.psZindex || 1000;
param.className = scope.psClass || 'ng-pageslide';
param.push = scope.psPush === 'true';
param.container = scope.psContainer || false;
param.keyListener = scope.psKeyListener === 'true';
param.bodyClass = scope.psBodyClass || false;
param.clickOutside = scope.psClickOutside !== 'false';
param.autoClose = scope.psAutoClose || false;

param.push = param.push && !param.container;

el.addClass(param.className);

Expand All @@ -61,37 +64,37 @@
body = document.body;
}


if (param.push) {
body.style.position = 'absolute';
body.style.transitionDuration = param.speed + 's';
body.style.webkitTransitionDuration = param.speed + 's';
body.style.transitionProperty = 'top, bottom, left, right';
}

function onBodyClick(e) {
if(isOpen && !slider.contains(e.target)) {
var target = e.touches && e.touches[0] || e.target;
if(
isOpen &&
body.contains(target) &&
!slider.contains(target)
) {
isOpen = false;
$scope.psOpen = false;
$scope.$apply();
scope.psOpen = false;
scope.$apply();
}

if($scope.psOpen) {
if(scope.psOpen) {
isOpen = true;
}
}

function setBodyClass(value){
if (param.bodyClass) {
var bodyClass = param.className + '-body';
var bodyClassRe = new RegExp(' ' + bodyClass + '-closed| ' + bodyClass + '-open');
var bodyClassRe = new RegExp(bodyClass + '-closed|' + bodyClass + '-open');
body.className = body.className.replace(bodyClassRe, '');
body.className += ' ' + bodyClass + '-' + value;
var newBodyClassName = bodyClass + '-' + value;
if (body.className[body.className.length -1] !== ' ') {
body.className += ' ' + newBodyClassName;
} else {
body.className += newBodyClassName;
}
}
}

setBodyClass('closed');

slider = el[0];

if (slider.tagName.toLowerCase() !== 'div' &&
Expand All @@ -114,53 +117,66 @@
slider.style.height = param.size;
slider.style.transitionProperty = 'top, bottom, left, right';

if (param.push) {
body.style.position = 'absolute';
body.style.transitionDuration = param.speed + 's';
body.style.webkitTransitionDuration = param.speed + 's';
body.style.transitionProperty = 'top, bottom, left, right';
}

if (param.container) {
slider.style.position = 'absolute';
body.style.position = 'relative';
body.style.overflow = 'hidden';
}

function onTransitionEnd() {
if ($scope.psOpen) {
if (typeof $scope.onopen === 'function') {
$scope.onopen();
if (scope.psOpen) {
if (typeof scope.onopen === 'function') {
scope.onopen()();
}
} else {
if (typeof $scope.onclose === 'function') {
$scope.onclose();
if (typeof scope.onclose === 'function') {
scope.onclose()();
}
}
}

slider.addEventListener('transitionend', onTransitionEnd);

initSlider();

function initSlider() {
function initSlider(slider, param) {
switch (param.side) {
case 'right':
slider.style.width = param.size;
slider.style.height = '100%';
slider.style.top = '0px';
slider.style.bottom = '0px';
slider.style.right = '0px';
break;
case 'left':
slider.style.width = param.size;
slider.style.height = '100%';
slider.style.top = '0px';
slider.style.bottom = '0px';
slider.style.left = '0px';
break;
case 'top':
slider.style.height = param.size;
slider.style.width = '100%';
slider.style.left = '0px';
slider.style.top = '0px';
slider.style.right = '0px';
break;
case 'bottom':
slider.style.height = param.size;
slider.style.width = '100%';
slider.style.bottom = '0px';
slider.style.left = '0px';
slider.style.right = '0px';
break;
}

if (scope.psOpen) {
psOpen(slider, param);
} else {
psClose(slider, param);
}
}

function psClose(slider, param) {
Expand Down Expand Up @@ -200,11 +216,11 @@
}

if (param.clickOutside) {
$document.off('click', onBodyClick);
$document.off('touchend click', onBodyClick);
}
isOpen = false;
setBodyClass('closed');
$scope.psOpen = false;
scope.psOpen = false;
}

function psOpen(slider, param) {
Expand Down Expand Up @@ -239,14 +255,14 @@
break;
}

$scope.psOpen = true;
scope.psOpen = true;

if (param.keyListener) {
$document.on('keydown', handleKeyDown);
}

if (param.clickOutside) {
$document.on('click', onBodyClick);
$document.on('touchend click', onBodyClick);
}
setBodyClass('open');
}
Expand All @@ -262,48 +278,50 @@
// http://stackoverflow.com/questions/12729122/angularjs-prevent-error-digest-already-in-progress-when-calling-scope-apply

$timeout(function () {
$scope.$apply();
scope.$apply();
});
}
}

// Initialize

initSlider(slider, param);

// Watchers

$scope.$watch('psOpen', function(value) {
scope.$watch('psOpen', function(value) {
if (!!value) {
psOpen(slider, param);
} else {
psClose(slider, param);
}
});

$scope.$watch('psSize', function(newValue, oldValue) {
scope.$watch('psSize', function(newValue, oldValue) {
if (oldValue !== newValue) {
param.size = newValue;
initSlider();
initSlider(slider, param);
}
});


// Events

$scope.$on('$destroy', function () {
scope.$on('$destroy', function () {
if (slider.parentNode === body) {
if (param.clickOutside) {
$document.off('click', onBodyClick);
$document.off('touchend click', onBodyClick);
}
body.removeChild(slider);
}

slider.removeEventListener('transitionend', onTransitionEnd);
});

if ($scope.psAutoClose) {
$scope.$on('$locationChangeStart', function() {
if (param.autoClose) {
scope.$on('$locationChangeStart', function() {
psClose(slider, param);
});
$scope.$on('$stateChangeStart', function() {
scope.$on('$stateChangeStart', function() {
psClose(slider, param);
});
}
Expand All @@ -312,5 +330,3 @@
};
}]);
}));


Loading