mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-20 12:29:55 +08:00
style(gestures): style updates
This commit is contained in:
@ -1,9 +1,8 @@
|
|||||||
|
import { defaults } from '../util/util';
|
||||||
import { defaults } from '../util';
|
|
||||||
import { GestureDelegate } from '../gestures/gesture-controller';
|
import { GestureDelegate } from '../gestures/gesture-controller';
|
||||||
import { PointerEvents, UIEventManager } from '../util/ui-event-manager';
|
|
||||||
import { PanRecognizer } from './recognizers';
|
import { PanRecognizer } from './recognizers';
|
||||||
import { pointerCoord, Coordinates } from '../util/dom';
|
import { PointerEvents, UIEventManager } from '../util/ui-event-manager';
|
||||||
|
import { pointerCoord } from '../util/dom';
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @private
|
* @private
|
||||||
@ -19,7 +18,6 @@ export interface PanGestureConfig {
|
|||||||
* @private
|
* @private
|
||||||
*/
|
*/
|
||||||
export class PanGesture {
|
export class PanGesture {
|
||||||
private dragging: boolean;
|
|
||||||
private events: UIEventManager = new UIEventManager(false);
|
private events: UIEventManager = new UIEventManager(false);
|
||||||
private pointerEvents: PointerEvents;
|
private pointerEvents: PointerEvents;
|
||||||
private detector: PanRecognizer;
|
private detector: PanRecognizer;
|
||||||
|
@ -1,19 +1,16 @@
|
|||||||
import { Injectable } from '@angular/core';
|
import { Injectable } from '@angular/core';
|
||||||
import { HammerGestureConfig } from '@angular/platform-browser';
|
import { HammerGestureConfig } from '@angular/platform-browser';
|
||||||
|
|
||||||
/* this class override the default angular gesture config.
|
|
||||||
* The motivation for this is enabling pinch, rotate or
|
|
||||||
* any other multi-touch gestures block scrolling.
|
|
||||||
*/
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @private
|
* @private
|
||||||
|
* This class overrides the default Angular gesture config.
|
||||||
*/
|
*/
|
||||||
@Injectable()
|
@Injectable()
|
||||||
export class IonicGestureConfig extends HammerGestureConfig {
|
export class IonicGestureConfig extends HammerGestureConfig {
|
||||||
|
|
||||||
buildHammer(element: HTMLElement) {
|
buildHammer(element: HTMLElement) {
|
||||||
var mc = new (<any> window).Hammer(element);
|
const mc = new (<any> window).Hammer(element);
|
||||||
|
|
||||||
for (let eventName in this.overrides) {
|
for (let eventName in this.overrides) {
|
||||||
mc.get(eventName).set(this.overrides[eventName]);
|
mc.get(eventName).set(this.overrides[eventName]);
|
||||||
@ -22,4 +19,4 @@ export class IonicGestureConfig extends HammerGestureConfig {
|
|||||||
return mc;
|
return mc;
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
@ -1,4 +1,3 @@
|
|||||||
|
|
||||||
import { forwardRef, Inject, Injectable } from '@angular/core';
|
import { forwardRef, Inject, Injectable } from '@angular/core';
|
||||||
import { App } from '../components/app/app';
|
import { App } from '../components/app/app';
|
||||||
|
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
import { defaults, assign } from '../util';
|
import { defaults, assign } from '../util/util';
|
||||||
import { Hammer, DIRECTION_HORIZONTAL, DIRECTION_VERTICAL } from './hammer';
|
import { Hammer, DIRECTION_HORIZONTAL, DIRECTION_VERTICAL } from './hammer';
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -1,7 +1,8 @@
|
|||||||
import { pointerCoord, Coordinates } from '../util/dom';
|
import { PointerCoordinates } from '../util/dom';
|
||||||
|
|
||||||
|
|
||||||
export class PanRecognizer {
|
export class PanRecognizer {
|
||||||
private startCoord: Coordinates;
|
private startCoord: PointerCoordinates;
|
||||||
private dirty: boolean = false;
|
private dirty: boolean = false;
|
||||||
private threshold: number;
|
private threshold: number;
|
||||||
private maxCosine: number;
|
private maxCosine: number;
|
||||||
@ -14,14 +15,14 @@ export class PanRecognizer {
|
|||||||
this.threshold = threshold * threshold;
|
this.threshold = threshold * threshold;
|
||||||
}
|
}
|
||||||
|
|
||||||
start(coord: Coordinates) {
|
start(coord: PointerCoordinates) {
|
||||||
this.startCoord = coord;
|
this.startCoord = coord;
|
||||||
this._angle = 0;
|
this._angle = 0;
|
||||||
this._isPan = 0;
|
this._isPan = 0;
|
||||||
this.dirty = true;
|
this.dirty = true;
|
||||||
}
|
}
|
||||||
|
|
||||||
detect(coord: Coordinates): boolean {
|
detect(coord: PointerCoordinates): boolean {
|
||||||
if (!this.dirty) {
|
if (!this.dirty) {
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
import { pointerCoord, Coordinates } from '../util/dom';
|
import { PointerCoordinates } from '../util/dom';
|
||||||
|
|
||||||
interface Point {
|
interface Point {
|
||||||
coord: Coordinates;
|
coord: PointerCoordinates;
|
||||||
duration: number;
|
duration: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -121,7 +121,7 @@ export class Simulate {
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
private newPoint(coord: Coordinates, duration: number) {
|
private newPoint(coord: PointerCoordinates, duration: number) {
|
||||||
this.points.push({
|
this.points.push({
|
||||||
coord: coord,
|
coord: coord,
|
||||||
duration: duration,
|
duration: duration,
|
||||||
@ -149,15 +149,15 @@ function randomAngle(maxAngle: number): number {
|
|||||||
return (Math.random() * maxAngle * 2) - maxAngle;
|
return (Math.random() * maxAngle * 2) - maxAngle;
|
||||||
}
|
}
|
||||||
|
|
||||||
function distance(a: Coordinates, b: Coordinates): number {
|
function distance(a: PointerCoordinates, b: PointerCoordinates): number {
|
||||||
let deltaX = a.x - b.x;
|
let deltaX = a.x - b.x;
|
||||||
let deltaY = a.y - a.y;
|
let deltaY = a.y - a.y;
|
||||||
return Math.hypot(deltaX, deltaY);
|
return Math.hypot(deltaX, deltaY);
|
||||||
}
|
}
|
||||||
|
|
||||||
function parseCoordinates(coord: Coordinates | number, y?: number): Coordinates {
|
function parseCoordinates(coord: PointerCoordinates | number, y?: number): PointerCoordinates {
|
||||||
if (typeof coord === 'number') {
|
if (typeof coord === 'number') {
|
||||||
return { x: coord, y: y };
|
return { x: coord, y: y };
|
||||||
}
|
}
|
||||||
return coord;
|
return coord;
|
||||||
}
|
}
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
import { PanGesture } from './drag-gesture';
|
import { PanGesture } from './drag-gesture';
|
||||||
import { clamp } from '../util';
|
import { clamp } from '../util/util';
|
||||||
import { pointerCoord } from '../util/dom';
|
import { pointerCoord } from '../util/dom';
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -1,7 +1,6 @@
|
|||||||
import { GestureController, DisableScroll } from '../../../src';
|
import { GestureController, DisableScroll } from '../gesture-controller';
|
||||||
|
|
||||||
export function run() {
|
|
||||||
|
|
||||||
|
describe('gesture controller', () => {
|
||||||
it('should create an instance of GestureController', () => {
|
it('should create an instance of GestureController', () => {
|
||||||
let c = new GestureController(null);
|
let c = new GestureController(null);
|
||||||
expect(c.isCaptured()).toEqual(false);
|
expect(c.isCaptured()).toEqual(false);
|
||||||
@ -310,5 +309,4 @@ export function run() {
|
|||||||
g.destroy();
|
g.destroy();
|
||||||
expect(c.isScrollDisabled()).toEqual(false);
|
expect(c.isScrollDisabled()).toEqual(false);
|
||||||
});
|
});
|
||||||
|
});
|
||||||
}
|
|
||||||
|
@ -1,31 +0,0 @@
|
|||||||
import { IonicGestureConfig } from '../../../src/gestures/ionic-gesture-config';
|
|
||||||
|
|
||||||
export function run() {
|
|
||||||
|
|
||||||
describe('IonicGestureConfig', () => {
|
|
||||||
it('should create a new instance of hammer', () => {
|
|
||||||
// arrange
|
|
||||||
let instance = new IonicGestureConfig();
|
|
||||||
let expectedParam = { name: "expectedParam"};
|
|
||||||
let expectedHammerInstance = { name: "hammer"};
|
|
||||||
|
|
||||||
let actualParam : any = null;
|
|
||||||
let callCount = 0;
|
|
||||||
|
|
||||||
(<any> window).Hammer = (param: any) => {
|
|
||||||
callCount++;
|
|
||||||
actualParam = param;
|
|
||||||
return expectedHammerInstance;
|
|
||||||
};
|
|
||||||
|
|
||||||
// act
|
|
||||||
let returnValue = instance.buildHammer( <HTMLElement> <any> expectedParam);
|
|
||||||
|
|
||||||
// assert
|
|
||||||
expect(returnValue.name).toEqual(expectedHammerInstance.name);
|
|
||||||
expect(callCount).toEqual(1);
|
|
||||||
expect(actualParam.name).toEqual(expectedParam.name);
|
|
||||||
});
|
|
||||||
})
|
|
||||||
|
|
||||||
}
|
|
@ -1,9 +1,8 @@
|
|||||||
|
|
||||||
import { PanRecognizer } from '../../../src/gestures/recognizers';
|
import { PanRecognizer } from '../recognizers';
|
||||||
import { Simulate } from '../../../src/gestures/simulator';
|
import { Simulate } from '../simulator';
|
||||||
|
|
||||||
export function run() {
|
|
||||||
|
|
||||||
|
describe('recognizers', () => {
|
||||||
it('should not fire if it did not start', () => {
|
it('should not fire if it did not start', () => {
|
||||||
let p = new PanRecognizer('x', 2, 2);
|
let p = new PanRecognizer('x', 2, 2);
|
||||||
expect(p.pan()).toEqual(0);
|
expect(p.pan()).toEqual(0);
|
||||||
@ -203,4 +202,4 @@ export function run() {
|
|||||||
|
|
||||||
expect(p.pan()).toEqual(0);
|
expect(p.pan()).toEqual(0);
|
||||||
});
|
});
|
||||||
}
|
});
|
||||||
|
Reference in New Issue
Block a user