angular-swipe

WebJar for angular-swipe

License

License

MIT
Categories

Categories

Github Development Tools Version Controls Angular User Interface Web Frameworks
GroupId

GroupId

org.webjars.bower
ArtifactId

ArtifactId

github-com-adzialocha-angular-swipe
Last Version

Last Version

0.2.1
Release Date

Release Date

Type

Type

jar
Description

Description

angular-swipe
WebJar for angular-swipe
Project URL

Project URL

http://webjars.org
Source Code Management

Source Code Management

https://github.com/adzialocha/angular-swipe

Download github-com-adzialocha-angular-swipe

How to add to project

<!-- https://jarcasting.com/artifacts/org.webjars.bower/github-com-adzialocha-angular-swipe/ -->
<dependency>
    <groupId>org.webjars.bower</groupId>
    <artifactId>github-com-adzialocha-angular-swipe</artifactId>
    <version>0.2.1</version>
</dependency>
// https://jarcasting.com/artifacts/org.webjars.bower/github-com-adzialocha-angular-swipe/
implementation 'org.webjars.bower:github-com-adzialocha-angular-swipe:0.2.1'
// https://jarcasting.com/artifacts/org.webjars.bower/github-com-adzialocha-angular-swipe/
implementation ("org.webjars.bower:github-com-adzialocha-angular-swipe:0.2.1")
'org.webjars.bower:github-com-adzialocha-angular-swipe:jar:0.2.1'
<dependency org="org.webjars.bower" name="github-com-adzialocha-angular-swipe" rev="0.2.1">
  <artifact name="github-com-adzialocha-angular-swipe" type="jar" />
</dependency>
@Grapes(
@Grab(group='org.webjars.bower', module='github-com-adzialocha-angular-swipe', version='0.2.1')
)
libraryDependencies += "org.webjars.bower" % "github-com-adzialocha-angular-swipe" % "0.2.1"
[org.webjars.bower/github-com-adzialocha-angular-swipe "0.2.1"]

Dependencies

compile (1)

Group / Artifact Type Version
org.webjars.bower : angular jar [1.6,1.7)

Project Modules

There are no modules declared in this project.

angular-swipe

Simple vertical/horizontal swipe gesture directives and a swipe service for angular js >= 1.6. Small extension of the existing angular $swipe service.

Install

  • Add this line to your bower.json dependencies and run bower install afterwards.
"angular-swipe": "~0.2.1"
  • Include the required source file (this path or similar)
<script src="bower_components/dist/angular-swipe.js"></script>
  • Inject the swipe module into your app.
angular.module('app', ['swipe']);

Usage

Module Name (Dependency)

  • swipe

Directives

  • ng-swipe-up
  • ng-swipe-down
  • ng-swipe-left
  • ng-swipe-right

Directive Attributes

ng-swipe-disable-mouse "This attribute is useful for text that should still be selectable by the mouse and not trigger the swipe action."

Service

  • swipe

Example

<div class="page" ng-controller="AppCtrl">
  <div class="container" ng-swipe-up="swipe($event)">
    <h1>Swipe me up!</h1>
  </div>
</div>
var app = angular.module('app', [ 'swipe' ]);
app.controller('AppCtrl', function AppCtrl($scope) {
  $scope.swipe = function($event) {
    console.log($event);
  };
})

Known issues and workarounds

  • ng-swipe-up and ng-swipe-down uses preventDefault when you start swiping. This prevents clicks from giving focus to input fields. Adding a noPreventDefault class to these elements will not preventDefault when the swipe start on them and thus allow clicks to work.

  • When embedding a Google map you might want to prevent a swipe event specifically inside the map. You can do that by adding the noStartDrag class to the Google map HTML element

Versions

Version
0.2.1
0.1.0