@starley/ion-directives 1.2.1 → 1.2.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +104 -0
- package/dist/input-mask/input-mask.directive.d.ts +2 -0
- package/dist/input-mask/input-mask.directive.js +2 -1
- package/dist/input-mask/input-mask.directive.js.map +1 -1
- package/dist/press-hold/press-hold.directive.js +0 -1
- package/dist/press-hold/press-hold.directive.js.map +1 -1
- package/dist/tap/tap.directive.js +0 -1
- package/dist/tap/tap.directive.js.map +1 -1
- package/package.json +1 -1
package/README.md
ADDED
|
@@ -0,0 +1,104 @@
|
|
|
1
|
+
|
|
2
|
+
# Ion-directives
|
|
3
|
+
|
|
4
|
+
São directivas para uso em ionic, para mascramento de inputs, pressHold, tap e doubleTap!
|
|
5
|
+
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
## Authors
|
|
11
|
+
|
|
12
|
+
- [@starleydev](https://www.github.com/starleyDev)
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
## Installation
|
|
16
|
+
|
|
17
|
+
|
|
18
|
+
```bash
|
|
19
|
+
npm i @starley/ion-directives
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
## Usage/Examples
|
|
23
|
+
|
|
24
|
+
Importe dentro do modulo que ira utilizar
|
|
25
|
+
|
|
26
|
+
my-component.module.ts
|
|
27
|
+
```typescript
|
|
28
|
+
import { DirectivesModule } from '@starley/ion-directives';
|
|
29
|
+
|
|
30
|
+
|
|
31
|
+
@NgModule({
|
|
32
|
+
...
|
|
33
|
+
imports: [
|
|
34
|
+
...,
|
|
35
|
+
DirectivesModule
|
|
36
|
+
],
|
|
37
|
+
...
|
|
38
|
+
})
|
|
39
|
+
export class MyComponent {}
|
|
40
|
+
```
|
|
41
|
+
|
|
42
|
+
### Para usar a mascara 'appMask'
|
|
43
|
+
|
|
44
|
+
Adicione dentro do input a chamada passando após o simbolo de '=' a formatação desejada!
|
|
45
|
+
|
|
46
|
+
my-component.html
|
|
47
|
+
```html
|
|
48
|
+
<ion-content>
|
|
49
|
+
...
|
|
50
|
+
<ion-item>
|
|
51
|
+
<ion-label>CPF</ion-label>
|
|
52
|
+
<ion-input class="ion-text-right" [(ngModel)]="cpf" maxlength="14" type="number" placeholder="000.000.000-00" appMask="***.***.***-**"></ion-input>
|
|
53
|
+
</ion-item>
|
|
54
|
+
...
|
|
55
|
+
</ion-content>
|
|
56
|
+
```
|
|
57
|
+
|
|
58
|
+
Resultado --> 123.456.789-00
|
|
59
|
+
|
|
60
|
+
### Para usar a pressHold 'appPressHold'
|
|
61
|
+
|
|
62
|
+
O tempo minimo e de 450 milisegundos! **( Adicionarei no futuro a possibilidade de customizar esse tempo! )**
|
|
63
|
+
|
|
64
|
+
Adicione a chamada de 'appPressHold' juntamente com o '(press)' pois ele será o responsavel pela ação!
|
|
65
|
+
|
|
66
|
+
my-component.html
|
|
67
|
+
```html
|
|
68
|
+
<ion-content>
|
|
69
|
+
...
|
|
70
|
+
<ion-item appPressHold (press)="doSomething()>
|
|
71
|
+
<ion-label>PressHold</ion-label>
|
|
72
|
+
</ion-item>
|
|
73
|
+
...
|
|
74
|
+
</ion-content>
|
|
75
|
+
```
|
|
76
|
+
|
|
77
|
+
### Para usar 'appTap'
|
|
78
|
+
|
|
79
|
+
Adicione dentro de um elemento qualquer! Ao adicionar você tera duas opções!
|
|
80
|
+
|
|
81
|
+
*O (tap) tera ação de intervalo de 250 milisegundos*
|
|
82
|
+
|
|
83
|
+
*O (doubleTap) terá ação de intervalo de 300 milisegundos*
|
|
84
|
+
|
|
85
|
+
my-component.html
|
|
86
|
+
```html
|
|
87
|
+
<ion-content>
|
|
88
|
+
...
|
|
89
|
+
<ion-content>
|
|
90
|
+
...
|
|
91
|
+
<ion-item appTap (tap)="doSomething()" (doubleTap)="doSomething()">
|
|
92
|
+
<ion-label>tap</ion-label>
|
|
93
|
+
</ion-item>
|
|
94
|
+
...
|
|
95
|
+
</ion-content>
|
|
96
|
+
...
|
|
97
|
+
</ion-content>
|
|
98
|
+
```
|
|
99
|
+
|
|
100
|
+
## License
|
|
101
|
+
|
|
102
|
+
|
|
103
|
+
[](https://choosealicense.com/licenses/mit/)
|
|
104
|
+
|
|
@@ -4,6 +4,8 @@ import * as i0 from "@angular/core";
|
|
|
4
4
|
import * as i1 from "@angular/forms";
|
|
5
5
|
/**
|
|
6
6
|
* Responsavel pelo mascaramento de inputs
|
|
7
|
+
* @author Thiago Przyczynski
|
|
8
|
+
* przyczynski@gmail.com
|
|
7
9
|
*/
|
|
8
10
|
var IonInputMaskDirective = /** @class */ (function () {
|
|
9
11
|
/**
|
|
@@ -14,7 +16,6 @@ var IonInputMaskDirective = /** @class */ (function () {
|
|
|
14
16
|
function IonInputMaskDirective(model, pattern) {
|
|
15
17
|
this.model = model;
|
|
16
18
|
this.pattern = pattern;
|
|
17
|
-
console.log('Inicou inputMask');
|
|
18
19
|
}
|
|
19
20
|
/**
|
|
20
21
|
* Listener para mudança de valor do input
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"input-mask.directive.js","sourceRoot":"","sources":["../../src/input-mask/input-mask.directive.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AACrD,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;;;AAEzC
|
|
1
|
+
{"version":3,"file":"input-mask.directive.js","sourceRoot":"","sources":["../../src/input-mask/input-mask.directive.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AACrD,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;;;AAEzC;;;;GAIG;AAEH;IAWI;;;;OAIG;IACH,+BAAmB,KAAc,EACP,OAAe;QADtB,UAAK,GAAL,KAAK,CAAS;QAE7B,IAAI,CAAC,OAAO,GAAG,OAAO,CAAC;IAC3B,CAAC;IAED;;;OAGG;IACH,yCAAS,GAAT,UAAU,KAAU;QAChB,IAAI,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,EAC1B,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC;QAC3B,IAAI,KAAK,CAAC,aAAa,KAAK,QAAQ,IAAI,KAAK,CAAC,OAAO,KAAK,CAAC,IAAI,KAAK,CAAC,GAAG,KAAK,WAAW,EAAE;YACtF,IAAI,KAAK,CAAC,MAAM,EAAE,EAAE,6EAA6E;gBAC7F,sDAAsD;gBACtD,OAAO,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,GAAG,EAAE;oBAC3D,KAAK,GAAG,KAAK,CAAC,SAAS,CAAC,CAAC,EAAE,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;iBAChD;gBACD,sDAAsD;gBACtD,IAAI,OAAO,CAAC,SAAS,CAAC,CAAC,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE;oBACrD,KAAK,GAAG,KAAK,CAAC,SAAS,CAAC,CAAC,EAAE,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;iBAChD;aACJ;SACJ;aAAM;YACH,IAAI,SAAS,GAAG,KAAK,CAAC,MAAM,CAAC;YAC7B,IAAI,SAAS,GAAG,EAAE,CAAC;YACnB,SAAS,IAAI,KAAK,CAAC;YACnB,IAAI,SAAS,GAAG,OAAO,CAAC,MAAM,EAAE;gBAC5B,2BAA2B;gBAC3B,OAAO,OAAO,CAAC,SAAS,CAAC,KAAK,GAAG,EAAE;oBAC/B,SAAS,IAAI,OAAO,CAAC,SAAS,CAAC,CAAC;oBAChC,SAAS,EAAE,CAAC;iBACf;aACJ;YACD,KAAK,GAAG,SAAS,CAAC;SACrB;QACD,KAAK,CAAC,MAAM,CAAC,KAAK,GAAG,KAAK,CAAC;QAC3B,IAAI,IAAI,CAAC,KAAK,EAAE;YACZ,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;SACjC;QACD,OAAO,IAAI,CAAC;IAChB,CAAC;8FAlDQ,qBAAqB,yDAUf,SAAS;4EAVf,qBAAqB;gHAArB,qBAAiB;8CAFf,CAAC,OAAO,CAAC;gCAdxB;CAoEC,AA3DD,IA2DC;SApDY,qBAAqB;uFAArB,qBAAqB;cAPjC,SAAS;eAAC;gBACP,QAAQ,EAAE,WAAW;gBACrB,IAAI,EAAE;oBACF,WAAW,EAAE,mBAAmB;iBACnC;gBACD,SAAS,EAAE,CAAC,OAAO,CAAC;aACvB;;sBAWQ,SAAS;uBAAC,SAAS","sourcesContent":["import { Attribute, Directive } from '@angular/core';\nimport { NgModel } from \"@angular/forms\";\n\n/**\n * Responsavel pelo mascaramento de inputs\n * @author Thiago Przyczynski\n * przyczynski@gmail.com\n */\n\n@Directive({\n selector: '[appMask]',\n host: {\n '(keydown)': 'onKeyDown($event)'\n },\n providers: [NgModel]\n})\nexport class IonInputMaskDirective {\n\n pattern: string;\n\n /**\n * Construtor\n * @param {NgModel} model\n * @param {string} pattern\n */\n constructor(public model: NgModel,\n @Attribute('appMask') pattern: string) {\n this.pattern = pattern;\n }\n\n /**\n * Listener para mudança de valor do input\n * @param event\n */\n onKeyDown(event: any) {\n let value = event.target.value,\n pattern = this.pattern;\n if (event.keyIdentifier === 'U+0008' || event.keyCode === 8 || event.key === 'Backspace') {\n if (value.length) { //prevent fatal exception when backspacing empty value in progressive web app\n //remove all trailing formatting then delete character\n while (pattern[value.length] && pattern[value.length] !== '*') {\n value = value.substring(0, value.length - 1);\n }\n //remove all leading formatting to restore placeholder\n if (pattern.substring(0, value.length).indexOf('*') < 0) {\n value = value.substring(0, value.length - 1);\n }\n }\n } else {\n let maskIndex = value.length;\n let formatted = '';\n formatted += value;\n if (maskIndex < pattern.length) {\n //apply trailing formatting\n while (pattern[maskIndex] !== '*') {\n formatted += pattern[maskIndex];\n maskIndex++;\n }\n }\n value = formatted;\n }\n event.target.value = value;\n if (this.model) {\n this.model.update.emit(value);\n }\n return true;\n }\n\n}"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"press-hold.directive.js","sourceRoot":"","sources":["../../src/press-hold/press-hold.directive.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,YAAY,EAAU,MAAM,EAAE,MAAM,eAAe,CAAC;;AAEtF;;;GAGG;AAEH;IAiBI;QAZU,UAAK,GAAG,IAAI,YAAY,EAAE,CAAC;QACrC,iBAAY,GAAG;YACX,IAAI,EAAE,OAAO;YACb,OAAO,EAAE,KAAK;YACd,QAAQ,EAAE,GAAG;SAChB,CAAC;QACF,iBAAY,GAAQ,IAAI,CAAC;QACzB,eAAU,GAAY,KAAK,CAAC;QAC5B,YAAO,GAAG,CAAC,CAAC;QACZ,aAAQ,GAAG,CAAC,CAAC;QACb,eAAU,GAAQ,IAAI,CAAC;
|
|
1
|
+
{"version":3,"file":"press-hold.directive.js","sourceRoot":"","sources":["../../src/press-hold/press-hold.directive.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,YAAY,EAAU,MAAM,EAAE,MAAM,eAAe,CAAC;;AAEtF;;;GAGG;AAEH;IAiBI;QAZU,UAAK,GAAG,IAAI,YAAY,EAAE,CAAC;QACrC,iBAAY,GAAG;YACX,IAAI,EAAE,OAAO;YACb,OAAO,EAAE,KAAK;YACd,QAAQ,EAAE,GAAG;SAChB,CAAC;QACF,iBAAY,GAAQ,IAAI,CAAC;QACzB,eAAU,GAAY,KAAK,CAAC;QAC5B,YAAO,GAAG,CAAC,CAAC;QACZ,aAAQ,GAAG,CAAC,CAAC;QACb,eAAU,GAAQ,IAAI,CAAC;IAEP,CAAC;IAEjB,qCAAQ,GAAR;QACI,IAAI,CAAC,YAAY,CAAC,OAAO,GAAG,IAAI,CAAC;IACrC,CAAC;IAID,oCAAO,GAFP,UAEQ,KAAqB;QACzB,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE;YAC5B,OAAO;SACV,CAAC,2CAA2C;QAC7C,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;IACpC,CAAC;IAEO,2CAAc,GAAtB,UAAuB,IAAY;QAAnC,iBAeC;QAdG,IAAI,IAAI,IAAI,YAAY,EAAE;YACtB,IAAI,CAAC,YAAY,GAAG,UAAU,CAAC;gBAC3B,KAAI,CAAC,UAAU,GAAG,IAAI,CAAC;YAC3B,CAAC,EAAE,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC,CAAC,kEAAkE;SACrG;aAAM,IAAI,IAAI,IAAI,UAAU,EAAE;YAC3B,YAAY,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;YAChC,IAAI,IAAI,CAAC,UAAU,EAAE;gBACjB,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;gBACvB,IAAI,CAAC,SAAS,EAAE,CAAC,CAAC,mDAAmD;aACxE;YACD,qGAAqG;YACrG,oCAAoC;YACpC,UAAU,CAAC,cAAM,OAAA,KAAI,CAAC,UAAU,GAAG,KAAK,EAAvB,CAAuB,EAAE,EAAE,CAAC,CAAC;SACjD;IACL,CAAC;IAEO,sCAAS,GAAjB;QACI,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,wBAAwB;QACvD,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC;QAClB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;QACvB,IAAI,CAAC,OAAO,GAAG,CAAC,CAAC;IACrB,CAAC;wFAnDQ,kBAAkB;yEAAlB,kBAAkB;mHAAlB,mBAAe,0FAAf,mBAAe;;6BAV5B;CA+DC,AAxDD,IAwDC;SArDY,kBAAkB;uFAAlB,kBAAkB;cAH9B,SAAS;eAAC;gBACP,QAAQ,EAAE,gBAAgB;aAC7B;sCAGa,KAAK;kBAAd,MAAM;YAoBP,OAAO;kBAFN,YAAY;mBAAC,YAAY,EAAE,CAAC,QAAQ,CAAC;;kBACrC,YAAY;mBAAC,UAAU,EAAE,CAAC,QAAQ,CAAC","sourcesContent":["import { Directive, EventEmitter, HostListener, OnInit, Output } from '@angular/core';\n\n/**\n * Gerencia pressHold\n * @author Starley Cazorla\n */\n\n@Directive({\n selector: '[appPressHold]'\n})\nexport class PressHoldDirective implements OnInit {\n\n @Output() press = new EventEmitter();\n pressGesture = {\n name: 'press',\n enabled: false,\n interval: 350\n };\n pressTimeout: any = null;\n isPressing: boolean = false;\n lastTap = 0;\n tapCount = 0;\n tapTimeout: any = null;\n\n constructor() { }\n\n ngOnInit(): void {\n this.pressGesture.enabled = true;\n }\n\n @HostListener('touchstart', ['$event'])\n @HostListener('touchend', ['$event'])\n onPress(event: { type: any; }) {\n if (!this.pressGesture.enabled) {\n return;\n } // Press is not enabled, don't do anything.\n this.handlePressing(event.type);\n }\n\n private handlePressing(type: string) { // touchend or touchstart\n if (type == 'touchstart') {\n this.pressTimeout = setTimeout(() => {\n this.isPressing = true;\n }, this.pressGesture.interval); // Considered a press if it's longer than interval (default: 251).\n } else if (type == 'touchend') {\n clearTimeout(this.pressTimeout);\n if (this.isPressing) {\n this.press.emit('end');\n this.resetTaps(); // Just incase this gets passed as a tap event too.\n }\n // Clicks have a natural delay of 300ms, so we have to account for that, before resetting isPressing.\n // Otherwise a tap event is emitted.\n setTimeout(() => this.isPressing = false, 50);\n }\n }\n\n private resetTaps() {\n clearTimeout(this.tapTimeout); // clear the old timeout\n this.tapCount = 0;\n this.tapTimeout = null;\n this.lastTap = 0;\n }\n\n}"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tap.directive.js","sourceRoot":"","sources":["../../src/tap/tap.directive.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,YAAY,EAAU,MAAM,EAAE,MAAM,eAAe,CAAC;;AAEtF;;;GAGG;AAEH;IAqBI;QAhBU,QAAG,GAAG,IAAI,YAAY,EAAE,CAAC;QACzB,cAAS,GAAG,IAAI,YAAY,EAAE,CAAC;QACzC,YAAO,GAAG,CAAC,CAAC;QACZ,aAAQ,GAAG,CAAC,CAAC;QACb,eAAU,GAAQ,IAAI,CAAC;QACvB,eAAU,GAAG;YACT,IAAI,EAAE,KAAK;YACX,OAAO,EAAE,KAAK;YACd,QAAQ,EAAE,GAAG;SAChB,CAAC;QACF,qBAAgB,GAAG;YACf,IAAI,EAAE,WAAW;YACjB,OAAO,EAAE,KAAK;YACd,QAAQ,EAAE,GAAG;SAChB,CAAC;
|
|
1
|
+
{"version":3,"file":"tap.directive.js","sourceRoot":"","sources":["../../src/tap/tap.directive.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,YAAY,EAAU,MAAM,EAAE,MAAM,eAAe,CAAC;;AAEtF;;;GAGG;AAEH;IAqBI;QAhBU,QAAG,GAAG,IAAI,YAAY,EAAE,CAAC;QACzB,cAAS,GAAG,IAAI,YAAY,EAAE,CAAC;QACzC,YAAO,GAAG,CAAC,CAAC;QACZ,aAAQ,GAAG,CAAC,CAAC;QACb,eAAU,GAAQ,IAAI,CAAC;QACvB,eAAU,GAAG;YACT,IAAI,EAAE,KAAK;YACX,OAAO,EAAE,KAAK;YACd,QAAQ,EAAE,GAAG;SAChB,CAAC;QACF,qBAAgB,GAAG;YACf,IAAI,EAAE,WAAW;YACjB,OAAO,EAAE,KAAK;YACd,QAAQ,EAAE,GAAG;SAChB,CAAC;IAEc,CAAC;IAEjB,+BAAQ,GAAR;QACI,IAAI,CAAC,UAAU,CAAC,OAAO,GAAG,IAAI,CAAC;QAC/B,IAAI,CAAC,gBAAgB,CAAC,OAAO,GAAG,IAAI,CAAC;IACzC,CAAC;IAGD,iCAAU,GADV,UACW,CAAyB;QADpC,iBAcC;QAZG,IAAM,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;QAC7C,IAAM,WAAW,GAAG,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,UAAU,CAAC,QAAQ,GAAG,YAAY,CAAC;QAC3E,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE;YAC5D,OAAO,IAAI,CAAC,SAAS,EAAE,CAAC;SAC3B;QACD,IAAI,CAAC,QAAQ,EAAE,CAAC;QAChB,IAAI,WAAW,IAAI,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE;YAC9C,IAAI,CAAC,QAAQ,EAAE,CAAC;SACnB;aAAM,IAAI,CAAC,WAAW,EAAE;YACrB,IAAI,CAAC,UAAU,GAAG,UAAU,CAAC,cAAM,OAAA,KAAI,CAAC,QAAQ,EAAE,EAAf,CAAe,EAAE,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC;SACjF;QACD,IAAI,CAAC,OAAO,GAAG,YAAY,CAAC;IAChC,CAAC;IAEO,+BAAQ,GAAhB;QACI,IAAI,IAAI,CAAC,QAAQ,KAAK,CAAC,IAAI,IAAI,CAAC,UAAU,CAAC,OAAO,EAAE;YAChD,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC;SACnB;aAAM,IAAI,IAAI,CAAC,QAAQ,KAAK,CAAC,IAAI,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE;YAC7D,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE,CAAC;SACzB;QACD,IAAI,CAAC,SAAS,EAAE,CAAC;IACrB,CAAC;IAEO,gCAAS,GAAjB;QACI,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,wBAAwB;QACvD,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC;QAClB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;QACvB,IAAI,CAAC,OAAO,GAAG,CAAC,CAAC;IACrB,CAAC;4EAvDQ,YAAY;mEAAZ,YAAY;mGAAZ,sBAAkB;;uBAV/B;CAmEC,AA5DD,IA4DC;SAzDY,YAAY;uFAAZ,YAAY;cAHxB,SAAS;eAAC;gBACP,QAAQ,EAAE,UAAU;aACvB;sCAGa,GAAG;kBAAZ,MAAM;YACG,SAAS;kBAAlB,MAAM;YAuBP,UAAU;kBADT,YAAY;mBAAC,OAAO,EAAE,CAAC,QAAQ,CAAC","sourcesContent":["import { Directive, EventEmitter, HostListener, OnInit, Output } from '@angular/core';\n\n/**\n * Gerencia tap e doubleTap\n * @author Starley Cazorla\n */\n\n@Directive({\n selector: '[appTap]'\n})\nexport class TapDirective implements OnInit {\n\n @Output() tap = new EventEmitter();\n @Output() doubleTap = new EventEmitter();\n lastTap = 0;\n tapCount = 0;\n tapTimeout: any = null;\n tapGesture = {\n name: 'tap',\n enabled: false,\n interval: 250,\n };\n doubleTapGesture = {\n name: 'doubleTap',\n enabled: false,\n interval: 300,\n };\n\n constructor() { }\n\n ngOnInit(): void {\n this.tapGesture.enabled = true;\n this.doubleTapGesture.enabled = true;\n }\n\n @HostListener('click', ['$event'])\n handleTaps(e: { timeStamp: number; }) {\n const tapTimestamp = Math.floor(e.timeStamp);\n const isDoubleTap = this.lastTap + this.tapGesture.interval > tapTimestamp;\n if (!this.tapGesture.enabled && !this.doubleTapGesture.enabled) {\n return this.resetTaps();\n }\n this.tapCount++;\n if (isDoubleTap && this.doubleTapGesture.enabled) {\n this.emitTaps();\n } else if (!isDoubleTap) {\n this.tapTimeout = setTimeout(() => this.emitTaps(), this.tapGesture.interval);\n }\n this.lastTap = tapTimestamp;\n }\n\n private emitTaps() {\n if (this.tapCount === 1 && this.tapGesture.enabled) {\n this.tap.emit();\n } else if (this.tapCount === 2 && this.doubleTapGesture.enabled) {\n this.doubleTap.emit();\n }\n this.resetTaps();\n }\n\n private resetTaps() {\n clearTimeout(this.tapTimeout); // clear the old timeout\n this.tapCount = 0;\n this.tapTimeout = null;\n this.lastTap = 0;\n }\n\n}\n"]}
|