@dreamworld/dw-ripple 2.4.0 → 3.0.0

package/.circleci/config.yml

@@ -1,45 +1,8 @@
 version: 2
 jobs:
-  merge-to-development:
-    machine: true
-    steps:
-      - run:
-          name: Clone Repository
-          working_directory: ~/workdir
-          command: |
-            echo "PR IS::"
-            echo $CIRCLE_PULL_REQUEST
-            if [[ -n ${CIRCLE_PULL_REQUEST} ]]
-            then
-              git clone https://${GH_TOKEN}@github.com/DreamworldSolutions/$CIRCLE_PROJECT_REPONAME.git  my-repo
-            else
-              echo "No PR Attached, so not doing anything"
-            fi
-      - run:
-          name: Merge PR branch to development
-          working_directory: ~/workdir/my-repo
-          command: |
-            if [[ -n ${CIRCLE_PULL_REQUEST} ]]
-            then
-              # circleci has 2.14.x as of now!
-              git --version
-              git config credential.helper 'cache --timeout=120'
-              git config user.email "dw-devops@dreamworld.solutions"
-              git config user.name "DW Devops"
-              git remote set-url --push origin https://${GH_TOKEN}@github.com/DreamworldSolutions/$CIRCLE_PROJECT_REPONAME.git
-              (git checkout -b feature/development origin/master || true)
-              (git pull origin feature/development || true)
-              git merge origin/$CIRCLE_BRANCH --no-ff --no-edit
-              git push origin feature/development
-              # Push quietly to prevent showing the token in log
-              git push -q origin feature/development
-            else
-              echo "No PR Attached, so not doing anything."
-            fi
-            
   release-snapshot:
     docker:
-      - image: circleci/node:14
+      - image: circleci/node:lts
     steps:
       - checkout
       - run: yarn install --frozen-lockfile --non-interactive
@@ -51,7 +14,7 @@ jobs:
             npx semantic-release
   release:
     docker:
-      - image: circleci/node:14
+      - image: circleci/node:lts
     steps:
       - checkout
       - run: yarn install --frozen-lockfile --non-interactive
@@ -60,18 +23,8 @@ jobs:
           name: Deploy
           command: npx semantic-release
 
-
 workflows:
   version: 2
-  merge-to-development:
-    jobs:
-      - merge-to-development:
-          context: Dreamworld
-          filters:
-            branches:
-              ignore:
-                - master
-                - feature/development
   release:
     jobs:
       - release-snapshot:
@@ -79,10 +32,10 @@ workflows:
           filters:
             branches:
               only:
-                - feature/development
+                - /^feature\/.+$/
       - release:
           context: Dreamworld
           filters:
-              branches:
-                only:
-                  - master
+            branches:
+              only:
+                - master

package/demo/dw-ripple-demo.js

@@ -1,5 +1,4 @@
-import { html, css } from "lit-element";
-import { LitElement } from "@dreamworld/pwa-helpers/lit-element.js";
+import { LitElement, html, css } from '@dreamworld/pwa-helpers/lit.js';
 
 //These are the dw element needed by this element.
 import "../dw-ripple.js";

package/dw-ripple.js

@@ -1,4 +1,4 @@
-import { css } from "lit-element";
+import { css } from '@dreamworld/pwa-helpers/lit.js';
 
 // These are the mwc element needed by this element.
 import { Ripple } from "@material/mwc-ripple";
@@ -49,6 +49,8 @@ export class DwRipple extends Ripple {
     this.__onTouchStart = this.__onTouchStart.bind(this);
     this.__onMouseUp = this.__onMouseUp.bind(this);
     this.__onTouchEnd = this.__onTouchEnd.bind(this);
+    this.__onPointerMove = this.__onPointerMove.bind(this);
+    this.__onTouchMove = this.__onTouchMove.bind(this);
 
     if (!this.disableHover) {
       parent.addEventListener("mouseenter", this._rippleHander.startHover);
@@ -59,16 +61,34 @@ export class DwRipple extends Ripple {
 
     parent.addEventListener("mousedown", this.__onMouseDown);
     parent.addEventListener("touchstart", this.__onTouchStart);
+    window.addEventListener("pointermove", this.__onPointerMove);
+    window.addEventListener("touchmove", this.__onTouchMove);
   }
 
   __onMouseDown(e) {
-    window.addEventListener("mouseup", this.__onMouseUp);
-    this._rippleHander.startPress(e);
+    this._timeoutRippleOnMouseDown = setTimeout(() => {
+      window.addEventListener("mouseup", this.__onMouseUp);
+      this._rippleHander.startPress(e);
+    }, 50);
   }
 
   __onTouchStart(e) {
-    window.addEventListener("touchend", this.__onTouchEnd);
-    this._rippleHander.startPress(e);
+    this._timeoutRippleOnTouchStart = setTimeout(() => {
+      window.addEventListener("touchend", this.__onTouchEnd);
+      this._rippleHander.startPress(e);
+    }, 50);
+  }
+
+  __onPointerMove() {
+    if (this._timeoutRippleOnMouseDown) {
+      clearTimeout(this._timeoutRippleOnMouseDown);
+    }
+  }
+
+  __onTouchMove() {
+    if (this._timeoutRippleOnTouchStart) {
+      clearTimeout(this._timeoutRippleOnTouchStart);
+    }
   }
 
   __onMouseUp() {
@@ -105,6 +125,8 @@ export class DwRipple extends Ripple {
 
     window.removeEventListener("touchend", this.__onTouchEnd);
     window.removeEventListener("mouseup", this.__onMouseUp);
+    window.removeEventListener("pointermove", this.__onPointerMove);
+    window.removeEventListener("touchmove", this.__onTouchMove);
 
     super.disconnectedCallback();
   }

package/package.json

@@ -1,10 +1,10 @@
 {
   "name": "@dreamworld/dw-ripple",
-  "version": "2.4.0",
+  "version": "3.0.0",
   "description": "Ripple element created as child-class of [`mwc-ripple`] (https://github.com/material-components/material-components-web-components/tree/master/packages/ripple)",
   "main": "dw-ripple.js",
   "scripts": {
-    "start": "polymer serve",
+    "start": "wds --node-resolve --app-index demo/index.html --open --watch",
     "test": "echo \"Error: no test specified\" && exit 1"
   },
   "repository": {
@@ -18,14 +18,14 @@
   },
   "homepage": "https://github.com/DreamworldSolutions/dw-ripple#readme",
   "dependencies": {
-    "@material/mwc-ripple": "^0.26.1",
-    "lit-element": "^2.2.0"
+    "@material/mwc-ripple": "0.27.0"
   },
   "devDependencies": {
-    "@dreamworld/material-styles": "^1.1.0",
-    "@dreamworld/pwa-helpers": "^1.10.0",
-    "@material/mwc-formfield": "^0.26.1",
-    "@material/mwc-switch": "^0.26.1",
+    "@dreamworld/material-styles": "^3.0.0",
+    "@dreamworld/pwa-helpers": "^1.13.1",
+    "@material/mwc-formfield": "0.27.0",
+    "@material/mwc-switch": "0.27.0",
+    "@web/dev-server": "^0.1.34",
     "@webcomponents/webcomponentsjs": "^2.2.10",
     "semantic-release": "17.4.2"
   },