moribvndvs / ng2-idle Goto Github PK
View Code? Open in Web Editor NEWResponding to idle users in Angular (not AngularJS) applications.
Home Page: https://moribvndvs.github.io/ng2-idle
License: Apache License 2.0
Responding to idle users in Angular (not AngularJS) applications.
Home Page: https://moribvndvs.github.io/ng2-idle
License: Apache License 2.0
In my application, there is a necessary to frequently re-visit a core component. I follow the example to reset the idle using idle.watch() every time the component class constructs. The behaviour is wrong so that each visit will create a running instance. Thus multiple onTimeout, onIdleEnd event will fire together when due. Even if I have programmably enforce idle.stop when the component onDestroy.
I have a project where I am using the Angular2 Webpack Starter project.
Because you've referfenced specific versions of rxjs etc., I get a node_modules directory in the node_modules/ng2-idle directory....
I get all sort of reference problems due to rxjs already being including in my typings
Have you been able to include ng2-idle in a webpack project?
If I delete the child node_modules directory, it seems to compile OK.
--mike
I'm submitting a ... (check one with "x")
[x ] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/HackedByChinese/ng2-idle/blob/master/CONTRIBUTING.md#getting-help
Current behavior
When I try to build my Angular 4 application I get the following error:
E:/Projects/INSTINCT/AnalystDashboard/src/Proxy_Reporting/node_modules/ng2-idle/node_modules/rxjs/Subject.d.ts(16,22): error TS2415: Class 'Subject' incorrectly extends base class 'Observable'.
Types of property 'lift' are incompatible.
Type '<T, R>(operator: Operator<T, R>) => Observable' is not assignable to type '(operator: Operator<T, R>) => Observable'.
Type 'Observable' is not assignable to type 'Observable'.
Type 'T' is not assignable to type 'R'.
Expected behavior
Expect the above issue not to occur
Minimal reproduction of the problem with instructions
What is the motivation / use case for changing the behavior?
Proper integration of this package into my application.
Please tell us about your environment:
Using Windows 7, Visual Studio 2015, npm 3.10.8
@ng-idle version: 2.x
Using ng2-idle 2.0.0-beta.12
Angular version: 2.x
Using angular 4.3.5
Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]
Using Google Chrome and IE 11
Language: [all | TypeScript X.X | ES6/7 | ES5]
Using Typescript 2.4.2, ES5/ES2015
Node: node --version
=
Using node version 6.9.1
I'm submitting a ... (check one with "x")
[ ] bug report => search github for a similar issue or PR before submitting
[X] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/HackedByChinese/ng2-idle/blob/master/CONTRIBUTING.md#getting-help
Current behavior
Adding default list of event listeners (DEFAULT_INTERRUPTSOURCES) causes warnings in Angular4.
EX:
[Violation] Added non-passive event listener to a scroll-blocking 'mousewheel' event. Consider marking event handler as 'passive' to make the page more responsive.
[Violation] Added non-passive event listener to a scroll-blocking 'touchstart' event. Consider marking event handler as 'passive' to make the page more responsive.
Expected behavior
Add event listeners in passive mode.
Minimal reproduction of the problem with instructions
const idle = new Idle();
idle.setInterrupts(DEFAULT_INTERRUPTSOURCES);
idle.watch();
What is the motivation / use case for changing the behavior?
Improved performance.
@ng-idle version: 2.0.0-beta.12
Angular version: 4.2.2
Browser: Chrome 51+
Language: all
Node: v6.10.3
In package.json:
`- "postinstall": "typings install",
Now gulp install
(global gulp) is npm run gulp install
.
This approach, while a little more verbose, is more accommodating for users or CI environments with a different version of typings or gulp installed globally.
Is there a method to stop idle.watch after a user successfully logs out?
Hello,
I am using ng2-idle in my ionic 2 beta project. Currently, we are in the process of migrating to ionic 2 RC0 (which updated to Angular 2.0.0 AOT from Angular 2 RC4 )
However, currently, I'm encountering 2 kinds of errors when I include ng2-idle providers.
error in ionic serve command:
bundle dev started...
Error reading template file, "my-component-tpl.html": Error: ENOENT: no file or directory, open 'ionic_app\node_modules\ng2-idle\node_modules@angular\core\src\animation\my-component-tpl.html'Error reading template file, "my-component-tpl.html": Error: ENOENT: no file or directory, open 'ionic_app\node_modules\ng2-idle-keep-alive\node_modules@angular\core\src\animation\my-component-tpl.html'
Error reading template file, "my-component-tpl.html": Error: ENOENT: no file or directory, open 'ionic_app\node_modules\ng2-idle-keepalive\node_modules@angular\http\src\people.html'
error in browser console
"Unhandled Promise rejection: No provider for Http!; Zone: ; Task: Promise.then; Value:"
My app.module.ts
@NgModule({
declarations: [ MyApp ]
imports: [IonicModule.forRoot(MyApp), HttpModule]
bootstrap: [IonicApp],
entryComponents: [MyApp],
providers: [IDLE_PROVIDERS, KEEP_ALIVE_PROVIDERS]
})
export class AppModule {}
(I'm not familiar yet with the changes in Angular 2.0.0 but I'm guess AOT compiling used by Ionic 2 RC0 may be a factor?)
Can anyone advise? Thanks
Is it possible to get more documentation on how to implement our own custom interrupt source? I haven't seen this anywhere in the documentation.
In my case, I want the user to no longer be considered idle whenever he moves his mouse or presses a key on the keyboard, not just within the tab, but anywhere on the computer, or at least in the browser.
I'm seeing InterruptSource
as an abstract class, but am not sure which properties it wants me to define when I extend from it It also looks like attachFn
and detachFn
are parameters passed to the constructor when instantiated, but I don't understand what should happen in these functions or what the purpose of them is. I assume attachFn
attaches the event it wants to listen to to this
somehow but is detachFn
called during destruction?
Hi guys,
I'm quite new to this environment, I'm sorry if I'll say something stupid, but I really need your help.
I was using your component in a previous version (in development stage) of my application, using SystemJs and Angular RC-6, and all seemed to work properly.
With the release of Angular 2 Final, I started a new project from scratch, switching to webpack (that I still can't figure out :-( )
I added IDLE_PROVIDERS to the providers of my module, like the previous version, but the application is asking me (and it wasn't before) to configure KeepAliveSvc in the providers. I have no need to use the keep-alive function of your component, I only need to manage the idle behaviour.
Tell me whatever you need
Thank you very much
Isaia
Hi, I just update NgIdleModule to beta 2.0.0-beta.4. My code looks like:
import {NgIdleModule} from '@ng-idle/core';
...
imports: [NgIdleModule.forRoot()]
But I'm receiving
GET http://localhost:5555/node_modules/@ng-idle/core.js 404 Not Found
I'm submitting a ... (check one with "x")
[ x] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/HackedByChinese/ng2-idle/blob/master/CONTRIBUTING.md#getting-help
Current behavior
ng2-idle's watching uses setInterval on the main angular zone which is blocking Protractor because it waits until all calls in the main zone are finished.
Expected behavior
setInterval is run outside of the main angular zone so that it doesn't block Protractor.
Minimal reproduction of the problem with instructions
You should be able to add protractor to an app setup for ng2-idle and use protractor --elementExplorer
and try to grab an element through Protractor's api.
Workaround
Should preferably deal with this inside of the plugin itself.
this._ngZone.runOutsideAngular(() => {
this.idle.watch();
});
this.idle.onTimeoutWarning.subscribe((countdown: number) => {
this._ngZone.run(() => { this.sessionEndCountdown = countdown });
});
What is the motivation / use case for changing the behavior?
Protractor tests don't work
Please tell us about your environment:
OSX EL Capitan 10.11.6
VS Code
2.0.0-beta.4
2.4.7
ALL
Language: [all | TypeScript X.X | ES6/7 | ES5]
ALL
Node: node --version
=
7
When using the "ng2-idle" component without the "ng2-idle-keepalive", the sample documentation on how to use causes me to get the following error when using Angular2 (currently using 2.1.x):
Error: No provider for KeepaliveSvc! at NoProviderError.BaseError [as constructor]
However, I can get around this but doing both of the following...
@NgModule({
providers: [
IDLE_PROVIDERS, {provide: KeepaliveSvc, useValue: undefined}, <-- insert a fake KeepaliveSvc injectable
],
and
export class AppComponent {
private configureIdleBehavior() {
// this._idle.setKeepaliveEnabled(false); //must comment this out, else app wants a valid KeepaliveSvc
My fix was pieced together with the help of some other issues but wanted to report it here so the documentation on the main page can be updated accordingly to help others getting bitten by this, or to actually fix the providers in the component to work properly with the official Angular 2+ releases.
Hi, the idle function doesn't work with CKEditor. When user typing in the CKEditor, always got idle and timeout. How to fix that?
Thanks
I'm submitting a ... (check one with "x")
[x] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/HackedByChinese/ng2-idle/blob/master/CONTRIBUTING.md#getting-help
Current behavior
If I include ng2-idle in my import modules while doing AOT compile I get the following error:
[11:54:02] Error: Error encountered resolving symbol values statically. Function calls are not supported. Consider replacing the function or lambda...
If I take out the ng2-idle import etc, it works fine.
Related to: angular/angular#11262
Does ng2-idle have support for AoT compilation? I don't see any .metadata.json files.
Please tell us about your environment:
Running with ionic 2, windows 10. typescript.
Current behavior
ng2-idle fails with error:
ERROR TypeError: Cannot read property 'indexOf' of null at StorageInterruptSource.webpackJsonp../node_modules/@ng-idle/core/src/storageinterruptsource.js.StorageInterruptSource.filterEvent (storageinterruptsource.js:22) at SafeSubscriber.handler [as _next] (eventtargetinterruptsource.js:33) at SafeSubscriber.webpackJsonp../node_modules/rxjs/Subscriber.js.SafeSubscriber.__tryOrUnsub (Subscriber.js:238) at SafeSubscriber.webpackJsonp../node_modules/rxjs/Subscriber.js.SafeSubscriber.next (Subscriber.js:185) at Subscriber.webpackJsonp../node_modules/rxjs/Subscriber.js.Subscriber._next (Subscriber.js:125) at Subscriber.webpackJsonp../node_modules/rxjs/Subscriber.js.Subscriber.next (Subscriber.js:89) at ThrottleTimeSubscriber.webpackJsonp../node_modules/rxjs/operator/throttleTime.js.ThrottleTimeSubscriber._next (throttleTime.js:93) at ThrottleTimeSubscriber.webpackJsonp../node_modules/rxjs/Subscriber.js.Subscriber.next (Subscriber.js:89) at handler (FromEventObservable.js:134) at ZoneDelegate.webpackJsonp../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:424)
Expected behavior
No such RTE.
Minimal reproduction of the problem with instructions
Failing on Chrome with code taken from ng2-idle examples:
idle.setIdle(5); idle.setTimeout(10 * 60); idle.setInterrupts(DEFAULT_INTERRUPTSOURCES); idle.onTimeout.subscribe(() => { console.log('timeout'); }); this.idle.watch();
Please tell us about your environment:
Os-x, Chrome (both latest).
node --version
= 7.9.0I'm submitting a ... (check one with "x")
[x ] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/HackedByChinese/ng2-idle/blob/master/CONTRIBUTING.md#getting-help
Current behavior
When using IE11 moving the mouse does not stop idle. (Using DEFAULT_INTERRUPTSOURCES)
Expected behavior
On other browsers tested (Chrome, Firefox and Edge) moving the mouse stops idle timeout
Minimal reproduction of the problem with instructions
Start up ng2-idle example https://hackedbychinese.github.io/ng2-idle in IE11. Wait for timeout countdown to start. Moving mouse does not stop countdown.
What is the motivation / use case for changing the behavior?
Please tell us about your environment:
@ng-idle version: 2.0.0-beta.4
Angular version: 2.2.1
Browser: IE 11
Language: [all | TypeScript 2.0.3 | ES6/7 | ES5]
Node: node --version
= 6.9.1
Hi everyone,
After upgraded my project to Angular 2.0.0, I can´t use browserify to generate bundle.js because ng2-idle throws "no provider for Http!" exception when I try to load my app from the browser (as I said, using bundle.js generated by browserify).
If I remove ng2-idle dependency from my components, I don´t get this exception and the app works flawlessly.
So, I suppose that ng2-idle should be switched to Angular 2.0.0. Is this statement correct?
Is there anything that I can do to overcome this problem?
Thanks in advance.
Tiago Peixoto.
Currently in Idle.prototype.toggleState when idleStart triggers it triggers the this.toggleInterrupts(false) which never allows idleEnd to occur. Seems like there needs to be one more condition here of not just this.idling but also the parent that called toggleState.
I'm submitting a ... (check one with "x")
[x] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/HackedByChinese/ng2-idle/blob/master/CONTRIBUTING.md#getting-help
Current behavior
I have a component like this:
<div *ngFor="let item of items">
<item-main [item]="item"></item-main>
<item-expanded *ngIf="item.expanded" [item]="item"></item-expanded>
</div>
Clicking on <item-main>
toggles the view of <item-expanded>
This works.
However, after I click on <item-main>
, 5000ms later, the IDLE_START
event is dispatched and the DOM updates and the <item-expanded>
disappears. (however, item.expanded
is still set to true
...)
Expected behavior
Clicking on <item-main>
toggles the view of <item-expanded>
and it should not disappear after 5000ms
Minimal reproduction of the problem with instructions
Our package.json is:
"@ng-idle/core": "2.0.0-beta.4",
"@ng-idle/keepalive": "2.0.0-beta.4",
What is the motivation / use case for changing the behavior?
I don't know why the UI changes even though the core object used by ngIf doesn't change...
Please tell us about your environment:
Running on mac
NPM = 4.1.2
NODE = 7.5.0
Angular = 2.2.4
Language: [TypeScript]
Node: node --version
=
I'm submitting a ... (check one with "x")
[X ] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/HackedByChinese/ng2-idle/blob/master/CONTRIBUTING.md#getting-help
Current behavior
Getting the following list of error when built with latest CLI using ng Eject option
WARNING in ./~/@ng-idle/core/index.js
Cannot find source file '../../../modules/core/index.ts': Error: Can't resolve '../../../modules/core/index.ts' in 'D:\NCP UI FrameWork\A2- Working space\ncpapp-8th version\node_modules@ng-idle\core'
@ ./src/app/core/ncpapp.module.ts 22:0-45
@ ./src/main.ts
@ multi (webpack)-dev-server/client?http://localhost:8080 ./src/main.ts
WARNING in .//@ng-idle/core/src/documentinterruptsource.js/@ng-idle/core/index.js 1:0-72 7:0-46
Cannot find source file '../../../../modules/core/src/documentinterruptsource.ts': Error: Can't resolve '../../../../modules/core/src/documentinterruptsource.ts' in 'D:\NCP UI FrameWork\A2- Working space\ncpapp-8th version\node_modules@ng-idle\core\src'
@ ./
@ ./src/app/core/ncpapp.module.ts
@ ./src/main.ts
@ multi (webpack)-dev-server/client?http://localhost:8080 ./src/main.ts
WARNING in .//@ng-idle/core/src/storageinterruptsource.js/@ng-idle/core/index.js 2:0-70 9:0-45
Cannot find source file '../../../../modules/core/src/storageinterruptsource.ts': Error: Can't resolve '../../../../modules/core/src/storageinterruptsource.ts' in 'D:\NCP UI FrameWork\A2- Working space\ncpapp-8th version\node_modules@ng-idle\core\src'
@ ./
@ ./src/app/core/ncpapp.module.ts
@ ./src/main.ts
@ multi (webpack)-dev-server/client?http://localhost:8080 ./src/main.ts
WARNING in .//@ng-idle/core/src/idle.js/@ng-idle/core/index.js 3:0-27
Cannot find source file '../../../../modules/core/src/idle.ts': Error: Can't resolve '../../../../modules/core/src/idle.ts' in 'D:\NCP UI FrameWork\A2- Working space\ncpapp-8th version\node_modules@ng-idle\core\src'
@ ./
@ ./src/app/core/ncpapp.module.ts
@ ./src/main.ts
@ multi (webpack)-dev-server/client?http://localhost:8080 ./src/main.ts
WARNING in .//@ng-idle/core/src/interruptargs.js/@ng-idle/core/index.js 4:0-36
Cannot find source file '../../../../modules/core/src/interruptargs.ts': Error: Can't resolve '../../../../modules/core/src/interruptargs.ts' in 'D:\NCP UI FrameWork\A2- Working space\ncpapp-8th version\node_modules@ng-idle\core\src'
@ ./
@ ./src/app/core/ncpapp.module.ts
@ ./src/main.ts
@ multi (webpack)-dev-server/client?http://localhost:8080 ./src/main.ts
WARNING in .//@ng-idle/core/src/interruptsource.js/@ng-idle/core/index.js 5:0-38
Cannot find source file '../../../../modules/core/src/interruptsource.ts': Error: Can't resolve '../../../../modules/core/src/interruptsource.ts' in 'D:\NCP UI FrameWork\A2- Working space\ncpapp-8th version\node_modules@ng-idle\core\src'
@ ./
@ ./src/app/core/ncpapp.module.ts
@ ./src/main.ts
@ multi (webpack)-dev-server/client?http://localhost:8080 ./src/main.ts
WARNING in .//@ng-idle/core/src/eventtargetinterruptsource.js/@ng-idle/core/index.js 6:0-49
Cannot find source file '../../../../modules/core/src/eventtargetinterruptsource.ts': Error: Can't resolve '../../../../modules/core/src/eventtargetinterruptsource.ts' in 'D:\NCP UI FrameWork\A2- Working space\ncpapp-8th version\node_modules@ng-idle\core\src'
@ ./
@ ./src/app/core/ncpapp.module.ts
@ ./src/main.ts
@ multi (webpack)-dev-server/client?http://localhost:8080 ./src/main.ts
WARNING in .//@ng-idle/core/src/windowinterruptsource.js/@ng-idle/core/index.js 8:0-44
Cannot find source file '../../../../modules/core/src/windowinterruptsource.ts': Error: Can't resolve '../../../../modules/core/src/windowinterruptsource.ts' in 'D:\NCP UI FrameWork\A2- Working space\ncpapp-8th version\node_modules@ng-idle\core\src'
@ ./
@ ./src/app/core/ncpapp.module.ts
@ ./src/main.ts
@ multi (webpack)-dev-server/client?http://localhost:8080 ./src/main.ts
WARNING in .//@ng-idle/core/src/keepalivesvc.js/@ng-idle/core/index.js 10:0-35
Cannot find source file '../../../../modules/core/src/keepalivesvc.ts': Error: Can't resolve '../../../../modules/core/src/keepalivesvc.ts' in 'D:\NCP UI FrameWork\A2- Working space\ncpapp-8th version\node_modules@ng-idle\core\src'
@ ./
@ ./src/app/core/ncpapp.module.ts
@ ./src/main.ts
@ multi (webpack)-dev-server/client?http://localhost:8080 ./src/main.ts
WARNING in .//@ng-idle/core/src/idleexpiry.js/@ng-idle/core/index.js 11:0-33
Cannot find source file '../../../../modules/core/src/idleexpiry.ts': Error: Can't resolve '../../../../modules/core/src/idleexpiry.ts' in 'D:\NCP UI FrameWork\A2- Working space\ncpapp-8th version\node_modules@ng-idle\core\src'
@ ./
@ ./src/app/core/ncpapp.module.ts
@ ./src/main.ts
@ multi (webpack)-dev-server/client?http://localhost:8080 ./src/main.ts
WARNING in .//@ng-idle/core/src/simpleexpiry.js/@ng-idle/core/index.js 12:0-35
Cannot find source file '../../../../modules/core/src/simpleexpiry.ts': Error: Can't resolve '../../../../modules/core/src/simpleexpiry.ts' in 'D:\NCP UI FrameWork\A2- Working space\ncpapp-8th version\node_modules@ng-idle\core\src'
@ ./
@ ./src/app/core/ncpapp.module.ts
@ ./src/main.ts
@ multi (webpack)-dev-server/client?http://localhost:8080 ./src/main.ts
WARNING in .//@ng-idle/core/src/localstorage.js/@ng-idle/core/index.js 13:0-35
Cannot find source file '../../../../modules/core/src/localstorage.ts': Error: Can't resolve '../../../../modules/core/src/localstorage.ts' in 'D:\NCP UI FrameWork\A2- Working space\ncpapp-8th version\node_modules@ng-idle\core\src'
@ ./
@ ./src/app/core/ncpapp.module.ts
@ ./src/main.ts
@ multi (webpack)-dev-server/client?http://localhost:8080 ./src/main.ts
WARNING in .//@ng-idle/core/src/localstorageexpiry.js/@ng-idle/core/index.js 14:0-41
Cannot find source file '../../../../modules/core/src/localstorageexpiry.ts': Error: Can't resolve '../../../../modules/core/src/localstorageexpiry.ts' in 'D:\NCP UI FrameWork\A2- Working space\ncpapp-8th version\node_modules@ng-idle\core\src'
@ ./
@ ./src/app/core/ncpapp.module.ts
@ ./src/main.ts
@ multi (webpack)-dev-server/client?http://localhost:8080 ./src/main.ts
WARNING in .//@ng-idle/core/src/module.js/@ng-idle/core/index.js 16:0-44
Cannot find source file '../../../../modules/core/src/module.ts': Error: Can't resolve '../../../../modules/core/src/module.ts' in 'D:\NCP UI FrameWork\A2- Working space\ncpapp-8th version\node_modules@ng-idle\core\src'
@ ./
@ ./src/app/core/ncpapp.module.ts
@ ./src/main.ts
@ multi (webpack)-dev-server/client?http://localhost:8080 ./src/main.ts
WARNING in .//@ng-idle/core/src/interrupt.js/@ng-idle/core/src/idle.js 3:0-40
Cannot find source file '../../../../modules/core/src/interrupt.ts': Error: Can't resolve '../../../../modules/core/src/interrupt.ts' in 'D:\NCP UI FrameWork\A2- Working space\ncpapp-8th version\node_modules@ng-idle\core\src'
@ ./
@ ./~/@ng-idle/core/index.js
@ ./src/app/core/ncpapp.module.ts
@ ./src/main.ts
@ multi (webpack)-dev-server/client?http://localhost:8080 ./src/main.ts
WARNING in .//@ng-idle/core/src/alternativestorage.js/@ng-idle/core/src/localstorage.js 2:0-58
Cannot find source file '../../../../modules/core/src/alternativestorage.ts': Error: Can't resolve '../../../../modules/core/src/alternativestorage.ts' in 'D:\NCP UI FrameWork\A2- Working space\ncpapp-8th version\node_modules@ng-idle\core\src'
@ ./
@ ./~/@ng-idle/core/index.js
@ ./src/app/core/ncpapp.module.ts
@ ./src/main.ts
@ multi (webpack)-dev-server/client?http://localhost:8080 ./src/main.ts
Expected behavior
NO warnings should be thrown
Minimal reproduction of the problem with instructions
node: 6.9.5
os: win32 x64
@angular/common: 2.4.8
@angular/compiler: 2.4.8
@angular/compiler-cli: 2.4.8
@angular/core: 2.4.8
@angular/forms: 2.4.8
@angular/http: 2.4.8
@angular/platform-browser: 2.4.8
@angular/platform-browser-dynamic: 2.4.8
@angular/platform-server: 2.4.8
@angular/router: 3.4.8
@angular/cli: 1.0.0-beta.32.3
In this config after using ng eject and running command npm start
node --version
= v6.9.5I'm submitting a ... (check one with "x")
[ ] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/HackedByChinese/ng2-idle/blob/master/CONTRIBUTING.md#getting-help
Current behavior
Whatever timeout is configured in settimeout the idle period and timeout did not end as per configuration. It has been observed that the last expiry value is not calculating it properly. Sometimes it did not fire timeout event after it occurs first time. This is mostly occuring when you set the large number in that timeout period.
Expected behavior
The timeout should happen whatever is configured in setTimeout.
Minimal reproduction of the problem with instructions
Settimeout for 60 second interval and 60 seconds in setIdle. The timeout occurs at anytime or sometimes did not occur at all.
What is the motivation / use case for changing the behavior?
Please tell us about your environment:
OS windows-10
@ng-idle version: 2.x
2.0.0-beta.12
Angular version: 2.x
Angular-4
Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]
All browser
Language: [all | TypeScript X.X | ES6/7 | ES5]
Typescript
Node: node --version
=
I'm submitting a ... (check one with "x")
[ ] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/HackedByChinese/ng2-idle/blob/master/CONTRIBUTING.md#getting-help
Current behavior
setTimeout is throwing error even when passing valid positive number in seconds.
idle.setTimeout(10);
throw new Error(''seconds' can only be 'false' or a positive number.');
Expected behavior
It should not throw error if it passes correct value.
Minimal reproduction of the problem with instructions
What is the motivation / use case for changing the behavior?
Please tell us about your environment:
All browser
node --version
=https://hackedbychinese.github.io/ng2-idle/
The example runs continue stopping countdown if I move the focus to other tab or applications.
Max OS X 10.12.4
Chrome Version 59.0.3053.3 (Official Build) dev (64-bit)
I'm submitting a ... (check one with "x")
[x] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/HackedByChinese/ng2-idle/blob/master/CONTRIBUTING.md#getting-help
Current behavior
Currently, if I allow the idle period to start while my focus is in another window (such as another application besides my browser), the idle period will not end when I return to the browser, click around with the mouse, type keys, etc. It works as expected only if the user becomes idle while focus is inside the window, which is not desired, since most users will become idle while in other windows.
Expected behavior
The idle period should end regardless of where the focus was when it began.
Minimal reproduction of the problem with instructions
Take appropriate steps to activate ng2idle in your application (such as logging in).
Move the mouse to another window besides the browser and shift the focus there by clicking.
Wait for your application to become idle.
Move the mouse back into the application and click to move the focus back.
Click or type keys to end the idle status.
The application will not become active un-idle.
I'm using the following initialization:
init () {
let interruptSource: WindowInterruptSource = new WindowInterruptSource('mousemove keydown DOMMouseScroll mousewheel mousedown touchstart touchmove scroll');
// sets the default interrupts, in this case, things like clicks, scrolls, touches to the document
this.idle.setInterrupts([interruptSource, new StorageInterruptSource()]);
// Subscribe to idle events. Add your logic on how the application should respond, such as displaying
this.keepalive.onPing.subscribe(() => {
this.ngZone.run(() => {
console.log("In keepalive ping");
});
});
this.idle.onTimeout.subscribe(() => {
this.ngZone.run(() => {
console.log("The user would be logout now");
});
});
// a warning dialog onIdleStart, or redirecting to logout page onTImeout, etc.
this.idle.onIdleStart.subscribe(() => {
this.ngZone.run(() => {
console.log('IdleStart');
});
});
this.idle.onTimeoutWarning.subscribe((countdown) => {
this.ngZone.run(() => {
console.log("Countdown", countdown);
});
});
this.idle.onIdleEnd.subscribe(() => {
this.ngZone.run(() => {
console.log("Idle ended");
});
});
// start watching for idleness right away.
this.start();
}
start () {
this.ngZone.runOutsideAngular(() => {
this.idle.watch();
});
}
What is the motivation / use case for changing the behavior?
Please tell us about your environment:
I'm using a Mac with Chrome, but have seen the same results on Browserstack emulating the Windows environment with both Chrome and Firefox.
Chrome, Firefox
Language: [all | TypeScript X.X | ES6/7 | ES5]
Typescript
Node: node --version
= 6.5.0
EDIT: Seems related to #40 - when not running this.idle.watch
outside of ngZone, it seems to behave correctly - but then Protractor tests fail.
When the onTimeoutWarning event is firing events, the interrupts are paused. I can't find a way to prevent the timeout. I don't think interrupts should be paused so that the timeout can be prevented.
What I want to do is display the countdown to the user and allow them to cancel the timeout simply by moving the mouse over the page. This is a feature that I had working with ng-idle for Angular 1 which doesn't seem to work in ng2-idle.
I'm submitting a ... (check one with "x")
[x] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/HackedByChinese/ng2-idle/blob/master/CONTRIBUTING.md#getting-help
Current behavior
I noticed when using my own DocumentInterruptSource instance that the scroll event doesn't trigger for document.documentElement.
However document.onscroll and window.onscroll work as expected so I'm using WindowInterruptSource for now.
Expected behavior
DocumentInterruptSource events should work for document event listeners
Minimal reproduction of the problem with instructions
in the browser console if you type and enter:
document.documentElement.onscroll = function() { console.log('scroll')}
and scroll, nothing happens.
My interrupt sources are:
let interruptSources: DocumentInterruptSource[] = [new DocumentInterruptSource( 'mousemove keydown mousedown touchstart touchmove scroll')];
What is the motivation / use case for changing the behavior?
The default interrupts use DocumentInterruptSource.
Please tell us about your environment:
MacOSX Chrome 55
@ng-idle version: 2.x
Older version 1.0.0-alpha.13
Angular version: 2.x
angular2-rc4
Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]
Chrome 55
Language: [all | TypeScript X.X | ES6/7 | ES5]
Typescript ^1.8.10
Node: node --version
=
v6.6.0
Using the latest version of ng2-Idle, I am not able to get it to work with the full release of Angular 2. I keep getting errors around No Provider for KeepAliveSrv.
To reproduce (using angular-cli):
ng new idleTest
npm install --save ng2-idle
There is no module exposed to add to app.module.ts, so I have to resort to adding IDLE_PROVIDERS to the providers section.
Hi,
It would be great to have a code snippet to see how to use the Idle service.
Thanks,
David
I'm submitting a ... (check one with "x")
[x] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/HackedByChinese/ng2-idle/blob/master/CONTRIBUTING.md#getting-help
Current behavior
I have two routes at app root level - login (LoginComponent) and content (ContentComponent).
Only content component has ng2-idle
configured in its constructor.
On first entry/visit to content view everything works fine.
However, if I go to logout (or any other view) and come back to content, the interrupts are not detected by ng2-idle
and onIdleStart
gets triggered after the timeout period! Even after that no matter how much I click on the screen or scroll etc, the onIdleEnd
event is not triggered and onIdleTimeout
gets triggered. After that everything again starts works well.
Expected behavior
ng2-idle should work consistently on first visit or subsequent visits to the route
Minimal reproduction of the problem with instructions
Please visit the following Plunk to check the bug:
https://plnkr.co/edit/OHhNJHYrmx0oWkIqYq7V?p=preview
What is the motivation / use case for changing the behavior?
Idle timeout is used only for protected content. It is never used for login page.
Please tell us about your environment:
OSx (macOS Sierra)
VSCode
NPM
Node.js
latest
2.4.4
Checked on Chrome, Safari & Firefox
Language: [all | TypeScript X.X | ES6/7 | ES5]
Typescript
Node: node --version
=
7.4.0
Hi, I'm on alpha 18 I just created a new ionic 2 project with
ionic start myApp --v2.
Then all I did was install via npm and include the module in my module's imports as in the ng2-idle-example repo.
I get this error and I cannot figure out why.
There is already a fixed merge for for RC5 support. Can you publish a new version to NPM?
br
After applying gulp-webpack to my ts scripts, running my application gets this error in Chrome:
Uncaught Invalid provider - only instances of Provider and Type are allowed, got: [object Object]
When I remove the IDLE_PROVIDERS from the bootstrap method it works fine.
Environment:
Angular2: RC1
ng2-idle: 1.0.0-alpha.12
We are attempting to update to the latest version of angular (2.3.0) using npm. In this, we recieved an error for your old ng2-idle-keepalive project.
After noticing you had merged the project into ng2-idle, we updated our package.json to request version 2.0.0-beta.4. It seems the latest packages haven't been published
Are you still supporting npm packages?
https://www.npmjs.com/package/ng2-idle
I'm submitting a ... (check one with "x")
[ ] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/HackedByChinese/ng2-idle/blob/master/CONTRIBUTING.md#getting-help
Current behavior
If we set the setIdle to whatever seconds. It doesn't raise onIdleStart event as per configured time. This happens normally if we set the timeInterval more than 5 seconds.
this.idle.setIdle(30);
It has been observed from console logs that the last value calculation is wrong. last value from LocalStorageExpiry.last() is coming wrong. Below is the sample code -
this.idle.setIdle(30);
const idleTimeout: number = parseInt(10);
// sets a timeout period of 5 seconds. after 10 seconds of inactivity, the user will be considered timed out.
// sets the default interrupts, in this case, things like clicks, scrolls, touches to the document
this.idle.setInterrupts(DEFAULT_INTERRUPTSOURCES);
const timeout = this.idle.getTimeout();
this.idle.onIdleEnd.subscribe(() => {
this.logger.debug('You are no longer idle. Click "OK" to close the warning dialog')
});
this.idle.onTimeout.subscribe(() => {
this.logger.debug('Timed out!');
});
this.idle.onIdleStart.subscribe(
() => {
this.logger.debug('You have gone idle. Idle time period started');
});
this.idle.onTimeoutWarning.subscribe((countdown: any) => {
this.logger.warn('timed out warning dialog - ' + countdown);
});
// sets the ping interval to 15 seconds
this.keepalive.interval(15);
this.keepalive.onPing.subscribe(() =>
log("KeepAlive call"));
this.idle.setTimeout(idleTimeout);
const timeOutInterval = this.idle.getTimeout();
this.idle.watch();
Expected behavior
The onIdleStart event should raised based on setIdle configuration.
Minimal reproduction of the problem with instructions
What is the motivation / use case for changing the behavior?
Please tell us about your environment:
OS10
@ng-idle version: 2.x
2.0.0-beta.12
Angular version: 2.x
Angular -4
Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]
All browser
Language: [all | TypeScript X.X | ES6/7 | ES5]
Typescript
Node: node --version
=
With the release of angular 2.0.0-rc.0 all of the angular packages have been renamed. This causes problems with ng2-idle.
I'm submitting a ... (check one with "x")
[X] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/HackedByChinese/ng2-idle/blob/master/CONTRIBUTING.md#getting-help
Current behavior
Following the example code at https://hackedbychinese.github.io/ng2-idle. When I run the tests, they timeout with this error:
Error: Timeout - Async callback was not invoked within timeout specified by jasmine.DEFAULT_TIMEOUT_INTERVAL.
If I remove the call to this.idle.watch(), the tests don't timeout.
Expected behavior
The tests should run and pass without timing out.
Minimal reproduction of the problem with instructions
I create a new project with angular-cli (RC2), add the example code, validate the example works in the UI, run the tests using ng test, the tests now fail with a timeout.
What is the motivation / use case for changing the behavior?
It would be nice to get the tests to work.
Please tell us about your environment:
MAC Sierra
@ng-idle version: 2.x
2.0.0-beta.8
Angular version: 2.x
2.4
Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Chrome
Language: [all | TypeScript X.X | ES6/7 | ES5]
Typescript
Node: node --version
=
6.9.4
Had ng2-idle implemented on a RC5/Webpack installation after following the GETTING STARTED part of the readme. Everything working fine. Upgraded to RC6 yesterday and got an error + app crash.
Image with the chrome console error
NoProviderError {_nativeError: Error: No provider for KeepaliveSvc! at NoProviderError.Error (native) at NoProviderError.Ba…, keys: Array[1], injectors: Array[1]}
_nativeError
:
Error: No provider for KeepaliveSvc! at NoProviderError.Error (native) at NoProviderError.BaseError [as constructor] (http://localhost/struktur/assets/d0a4e284/vendor.bundle.js:1618:39) at NoProviderError.AbstractProviderError [as constructor] (http://localhost/struktur/assets/d0a4e284/vendor.bundle.js:2102:21) at new NoProviderError (http://localhost/struktur/assets/d0a4e284/vendor.bundle.js:2133:21) at ReflectiveInjector_._throwOrNull (http://localhost/struktur/assets/d0a4e284/vendor.bundle.js:3735:24) at ReflectiveInjector_._getByKeyDefault (http://localhost/struktur/assets/d0a4e284/vendor.bundle.js:3763:30) at ReflectiveInjector_._getByKey (http://localhost/struktur/assets/d0a4e284/vendor.bundle.js:3726:30) at ReflectiveInjector_.get (http://localhost/struktur/assets/d0a4e284/vendor.bundle.js:3535:26) at NgModuleInjector.AppModuleInjector.createInternal (AppModule.ngfactory.js:451:67) at NgModuleInjector.create (http://localhost/struktur/assets/d0a4e284/vendor.bundle.js:9911:81)
constructResolvingMessage
I have not tried to install the ng2-keepalive library in my app.
What I did try was to declare the KeepaliveSvc class as a provider in app.module.ts and in the component where the Idle functions run in different ways with no success.
Setup:
"dependencies": {
"@angular/common": "2.0.0-rc.6",
"@angular/compiler": "2.0.0-rc.6",
"@angular/compiler-cli": "0.6.0",
"@angular/core": "2.0.0-rc.6",
"@angular/forms": "2.0.0-rc.6",
"@angular/http": "2.0.0-rc.6",
"@angular/platform-browser": "2.0.0-rc.6",
"@angular/platform-browser-dynamic": "2.0.0-rc.6",
"@angular/router": "3.0.0-rc.2",
"@angular/upgrade": "2.0.0-rc.6",
"@ng-bootstrap/ng-bootstrap": "^1.0.0-alpha.3",
"angular2-apollo": "^0.4.3",
"angular2-modal": "^2.0.0-beta.12",
"apollo-client": "^0.4.11",
"core-js": "^2.2.0",
"es6-promise": "^3.2.1",
"ie-shim": "^0.1.0",
"isomorphic-fetch": "^2.2.1",
"ng2-bootstrap": "^1.0.24",
"ng2-idle": "^1.0.0-alpha.15",
"ng2-redux": "^3.3.5",
"redux": "^3.5.2",
"rxjs": "5.0.0-beta.6",
"typescript": "^1.9.0-dev",
"zone.js": "~0.6.12"
}
app.module.ts:
import { IDLE_PROVIDERS } from 'ng2-idle/core';
providers : [
...
IDLE_PROVIDERS
]
auth-timer.component.ts:
import { Idle, DEFAULT_INTERRUPTSOURCES } from 'ng2-idle/core';
constructor(
private idle: Idle
)
{
idle.setIdle(600);
idle.setTimeout(180);
idle.setInterrupts(DEFAULT_INTERRUPTSOURCES);
idle.onIdleStart.subscribe(() => {
console.log('IdleStart');
});
idle.onIdleEnd.subscribe(() => {
console.log('IdleEnd');
});
idle.onTimeoutWarning.subscribe((countdown:number) => {
console.log('TimeoutWarning: ' + countdown);
});
idle.onTimeout.subscribe(() => {
console.log('Timeout');
});
// start watching for idleness right away.
idle.watch();
}
I'm submitting a ... (check one with "x")
[ ] bug report => search github for a similar issue or PR before submitting
[x] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/HackedByChinese/ng2-idle/blob/master/CONTRIBUTING.md#getting-help
Current behavior
The keepalive module accepts a string or Request in request() for configuring the ping request.
Expected behavior
I'd like to have the ability to pass a function that returns a promise.
Minimal reproduction of the problem with instructions
n/a
What is the motivation / use case for changing the behavior?
I have an app that needs to add special headers to HTTP requests. I extended Angular's Http to enable this. I'd rather use a service that I already wrote instead of manually constructing the Request to pass to keepalive.request().
Please tell us about your environment:
Idea, npm, linux
All
Language: [all | TypeScript X.X | ES6/7 | ES5]
All
Node: node --version
= 6.10.3
Thank you!
I'm submitting a ... (check one with "x")
[ x] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/HackedByChinese/ng2-idle/blob/master/CONTRIBUTING.md#getting-help
Current behavior
When Idle start: onIdleStart:
core.es5.js:1084 ERROR TypeError: Cannot read property 'getTime' of null
at watchFn (idle.js:202)
at ZoneDelegate.webpackJsonp.1271.ZoneDelegate.invokeTask (zone.js:424)
at Object.onInvokeTask (core.es5.js:4140)
at ZoneDelegate.webpackJsonp.1271.ZoneDelegate.invokeTask (zone.js:423)
at Zone.webpackJsonp.1271.Zone.runTask (zone.js:191)
at ZoneTask.invoke (zone.js:486)
at timer (zone.js:1512)
Expected behavior
Subscription to onIdleStart should be triggered.
Minimal reproduction of the problem with instructions
This is the method used in AppComponent
constructor(private idle: Idle) {
this.setupIdle();
}
private setupIdle() {
this.idle.setIdle(20);
this.idle.onIdleStart.subscribe(() => {
....
});
this.resetIdle();
}
private resetIdle() {
this.idle.watch(true);
}
What is the motivation / use case for changing the behavior?
Auto logout when user idle
Please tell us about your environment:
Windows 10, IntelliJ IDEA, NPM, Node.js
"@ng-idle/core": "^2.0.0-beta.11"
"@angular/core": "^4.1.1"
Chrome 58.0.3029.110
Language: [all | TypeScript X.X | ES6/7 | ES5]
TypeScript
Node: node --version
=
v6.10.3
I'm submitting a ... (check one with "x")
[ ] bug report => search github for a similar issue or PR before submitting
[x] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/HackedByChinese/ng2-idle/blob/master/CONTRIBUTING.md#getting-help
Current behavior
npm WARN @ng-idle/[email protected] requires a peer of @angular/common@^2.0.0 but none was installed.
npm WARN @ng-idle/[email protected] requires a peer of @angular/core@^2.0.0 but none was installed.
Expected behavior
npm install --save @ng-idle/core@latest
should work with an Angular 4 project.
Minimal reproduction of the problem with instructions
Run npm install --save @ng-idle/core@latest
on an Angular 4 project.
What is the motivation / use case for changing the behavior?
We want to upgrade our application to Angular 4, but @ng-idle/core
is the only package that we use that doesn't support it yet.
Please tell us about your environment:
macOS, IntelliJ, npm or yarn, webpack
@ng-idle version: 2.0.0-beta.9
Angular version: 4.0.0
Node: node --version
= v7.7.4
I'm submitting a ... (check one with "x")
[x] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/HackedByChinese/ng2-idle/blob/master/CONTRIBUTING.md#getting-help
Current behavior
When I call the stop function on my Idle. This function call 'this.expiry.last(null)' with expiry instance of LocalStorageExpiry. The LocalStorageExpiry don't check the null value and throw the TypeError: Cannot read property 'getTime' of null TypeError: Cannot read property 'getTime' of null at LocalStorageExpiry
Expected behavior
Check null value when we set expiry in LocalStorageExpiry
Minimal reproduction of the problem with instructions
What is the motivation / use case for changing the behavior?
Please tell us about your environment:
Language: [all | TypeScript X.X | ES6/7 | ES5]
Node: node --version
=
I'm submitting a ... (check one with "x")
[x] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/HackedByChinese/ng2-idle/blob/master/CONTRIBUTING.md#getting-help
Current behavior
$ npm run format
> [email protected] format /Users/pivotal/workspace/ng2-idle
> gulp clang:format
[10:11:55] No gulpfile found
npm ERR! Darwin 16.4.0
npm ERR! argv "/usr/local/Cellar/node/7.7.4/bin/node" "/usr/local/bin/npm" "run" "format"
npm ERR! node v7.7.4
npm ERR! npm v4.1.2
npm ERR! code ELIFECYCLE
npm ERR! [email protected] format: `gulp clang:format`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] format script 'gulp clang:format'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the ng-idle-src package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR! gulp clang:format
npm ERR! You can get information on how to open an issue for this project with:
npm ERR! npm bugs ng-idle-src
npm ERR! Or if that isn't available, you can get their info via:
npm ERR! npm owner ls ng-idle-src
npm ERR! There is likely additional logging output above.
npm ERR! Please include the following file with any support request:
npm ERR! /Users/pivotal/workspace/ng2-idle/npm-debug.log
Expected behavior
npm run format
is supposed to use clang-format to clean up the source. Either this should fixed or it should be removed.
Minimal reproduction of the problem with instructions
npm run format
In looking at the systemjs.config.js
from the Quickstart, we see how to reference packages via map
and packages
from the SystemJS config API. For all of the scoped @angular
packages this works swimmingly. However, I cannot get ng2-idle
or ng2-idle-keepalive
to properly be referenced. What am I doing wrong?
Here is my wwwroot/js
folder hierarchy:
js
| bootstrap.js
| bootstrap.min.js
| jquery.js
| jquery.min.js
| jquery.scrollbar.js
| jquery.scrollbar.min.js
| Reflect.js
| Reflect.min.js
| system.src.js
| system.src.min.js
| zone.js
| zone.min.js
+---@angular
| +---common
| | \---bundles
| | common.umd.js
| | common.umd.min.js
| +---compiler
| | \---bundles
| | compiler.umd.js
| | compiler.umd.min.js
| +---core
| | \---bundles
| | core.umd.js
| | core.umd.min.js
| +---forms
| | \---bundles
| | forms.umd.js
| | forms.umd.min.js
| +---http
| | \---bundles
| | http.umd.js
| | http.umd.min.js
| +---platform-browser
| | \---bundles
| | platform-browser.umd.js
| | platform-browser.umd.min.js
| +---platform-browser-dynamic
| | \---bundles
| | platform-browser-dynamic.umd.js
| | platform-browser-dynamic.umd.min.js
| +---router
| | \---bundles
| | router.umd.js
| | router.umd.min.js
| +---router-deprecated
| | \---bundles
| | router-deprecated.umd.js
| | router-deprecated.umd.min.js
| \---upgrade
| \---bundles
| upgrade.umd.js
| upgrade.umd.min.js
+---ng2-ext
| angular2localization.umd.js
| angular2localization.umd.min.js
| ng2-bs3-modal.js
| ng2-bs3-modal.min.js
| ng2-idle-keepalive.js
| ng2-idle-keepalive.min.js
| ng2-idle.js
| ng2-idle.min.js
\---rxjs
\---bundles
Rx.umd.js
Rx.umd.min.js
Here is my systemjs.config.js
:
(function (global) {
var packages = {
'ng2-idle/core': { defaultExtension: 'js' },
'ng2-idle-keepalive/core': { defaultExtension: 'js' },
'ng2-bs3-modal/ng2-bs3-modal': { defaultExtension: 'js' }
};
var ngPackageNames = [
'common',
'compiler',
'core',
'forms',
'http',
'platform-browser',
'platform-browser-dynamic',
'router',
'router-deprecated',
'upgrade',
];
ngPackageNames.forEach(function (pkgName) {
packages['@angular/' + pkgName] = {
main: '/bundles/' + pkgName + '.umd.js', defaultExtension: 'js'
};
});
System.config({
defaultJSExtensions: true,
paths: {
'rxjs/*': 'js/rxjs/bundles/Rx.umd.min.js',
'angular2localization/*': 'js/ng2-ext/angular2localization.umd.min.js'
},
map: {
'app': 'app/shell',
'@angular': 'js/@angular',
'ng2-idle': 'js/ng2-ext',
'ng2-idle-keepalive': 'js/ng2-ext',
'ng2-bs3-modal': 'js/ng2-ext'
},
packages: packages
});
})(this);
When the files are requested by the client module loader, they return happily but then references to any objects of these from import
statements are undefined
?
Keep in mind that I have tried all sorts of alternative ways of referencing these packages, including but not limited to paths
, implicit versus explicit main
reference in packages
, implicit versus explicit .js
file in map
, etc...
please update ng4 ASAP or update "@angular/common"
"@angular/core" of peerDependencies to more than 4.0 version
Thank
I'm submitting a ...
[ x ] bug report => search github for a similar issue or PR before submitting
[ - ] feature request
[ - ] support request => Please do not submit support request here, instead see https://github.com/HackedByChinese/ng2-idle/blob/master/CONTRIBUTING.md#getting-help
Current behavior
There are three ways to send an app to the "background" (in general). Only in the first scenario, where the hardware button is pushed, the onTimeout event is triggered correctly.
[ x ] Using the home button; works correctly
[ - ] Switching to another app (double tap home button / switch app button); not working
[ - ] Turning the screen off (clicking the off button shortly); not working
Expected behavior
Minimal reproduction of the problem with instructions
Send an Cordova / Ionic 2 app to the background via either the second or third method.
Please tell us about your environment:
I'm submitting a ... (check one with "x")
[X] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/HackedByChinese/ng2-idle/blob/master/CONTRIBUTING.md#getting-help
Current behavior
Created a cookie based IdleExpiry that stores lastValue as a cookie. Activity in one tab does not prevent timeout in another tab.
I was able to get something close to what I wanted by modifying the toggleState method in Idle and inserting the following at the top of the function:
if (!this.expiry.isExpired()) { return; }
This checks the cookie and prevents expiration.
Expected behavior
Activity in one tab prevents timeout in all tabs.
Minimal reproduction of the problem with instructions
Replace SimpleExpiry with the following class
`@Injectable()
export class CookieExpiry extends IdleExpiry {
private lastValue: Date = undefined;
constructor(
private cookieService: CookieService
) {
super();
}
/*
/*
What is the motivation / use case for changing the behavior?
Allow activity on one tab to keep other tabs from expiring. Since all tabs are using the same session cookie the "out-of-focus" tab is expiring session for all tabs.
Please tell us about your environment:
Ubuntu 16.04
NPM
Webpack-dev server
@ng-idle version: 2.x
"@ng-idle/core": "^2.0.0-beta.4"
Angular version: 2.x
"@angular/core": "2.1.2"
Browser:
ALL
Language:
ALL
Node: node --version
=
v5.12.0
Hi this works fine in dev mode and regular peoduction mode but AoT does not compile. It gives node_modules/ng2-idle/core"' has no exported member 'IDLE_PROVIDERS'.
and node_modules/ng2-idle-keepalive/core"' has no exported member 'KEEPALIVE_PROVIDERS'
This is with angular 2.1.0
I'm submitting a ... (check one with "x")
[ ] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/HackedByChinese/ng2-idle/blob/master/CONTRIBUTING.md#getting-help
Current behavior
Expected behavior
Minimal reproduction of the problem with instructions
What is the motivation / use case for changing the behavior?
Please tell us about your environment:
Language: [all | TypeScript X.X | ES6/7 | ES5]
Node: node --version
=
My problem is that when click on the logout button ng2-idle continues working. And to try to solve this problem I set again the setIdle and setTimeout functions for 1 second.
However, when the user is transferred to the login screen, the app takes 1 second to give the timeout.
I like to know if have any way of forcing the timeout or end ng2-idle after click the logout button that call logout() function.
import {Component} from '@angular/core';
import {Router} from "@angular/router";
import {Http, Headers} from "@angular/http";
import {NgClass} from '@angular/common';
import {Observable} from "rxjs/Observable";
import 'rxjs/Rx';
import {HeaderService} from './header.service';
import {Idle, DEFAULT_INTERRUPTSOURCES} from 'ng2-idle/core';
@Component({
selector: 'my-header',
templateUrl: './js/app/header/header.component.html',
styleUrls: ['./js/app/header/header.component.css']
})
export class HeaderComponent {
nome = localStorage['nome'];
constructor(private _router: Router, private _http: Http, private _headerService: HeaderService, private idle: Idle) {
idle.setIdle(5);
idle.setTimeout(1800);
idle.setInterrupts(DEFAULT_INTERRUPTSOURCES);
idle.onTimeoutWarning.subscribe((countdown:number) => {
console.log('TimeoutWarning: ' + countdown);
});
idle.onTimeout.subscribe(() => {
console.log('Timeout');
localStorage.clear();
this._router.navigate(['/auth', {sessionExpirate: 'true'}]);
});
idle.watch();
}
logout() {
this.idle.setIdle(1);
this.idle.setTimeout(1);
this.idle.setInterrupts(DEFAULT_INTERRUPTSOURCES);
this._headerService.exit()
.subscribe(
data => {
this.idle.onTimeout.subscribe(() => {
console.log('Timeout');
localStorage.clear();
this._router.navigate(['/auth']);
},
error => console.log(error)
)}
)
}
}
Angular4 with @ng2-idle trying to capture the inactivity of the user.
code example link
https://hackedbychinese.github.io/ng2-idle/
I am trying to customize it so every time user goes idle i show modal with ok button. and user will able to resume only ok is clicked on the modal.
on page load default interrupts are on
idle.setInterrupts(DEFAULT_INTERRUPTSOURCES);
on idleStart
i show my modal and count down begins
on onIdleEnd
i close my modal
when modal is open i want to disable DEFAULT_INTERRUPTSOURCES
only manual interrupt so i called idle.clearInterrupts()
and on modal ok press event calling idle.interrupt(true);
once modal is close i set idle.setInterrupts(DEFAULT_INTERRUPTSOURCES);
again.
does not seems to work very well. after modal close and open again it does not car about DEFAULT_INTERRUPTSOURCES
and on setIdle
time it goes automiticaly idle
mode even though user interacts with the UI.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.