@operato/utils 0.3.4 → 0.3.13

package/src/password-pattern.ts

@@ -0,0 +1,48 @@
+export function generatePasswordPatternRegExp({
+  lowerCase = true,
+  upperCase = true,
+  digit = true,
+  specialCharacter = true,
+  allowRepeat = false,
+  useTightPattern = true,
+  useLoosePattern = false,
+  tightCharacterLength = 8,
+  looseCharacterLength = 15
+}: {
+  lowerCase?: boolean
+  upperCase?: boolean
+  digit?: boolean
+  specialCharacter?: boolean
+  allowRepeat?: boolean
+  useTightPattern?: boolean
+  useLoosePattern?: boolean
+  tightCharacterLength?: Number
+  looseCharacterLength?: Number
+} = {}) {
+  var tightChecklist = useTightPattern
+    ? [
+        lowerCase ? '(?=.*[a-z])' : '', // has at least one lower case character
+        upperCase ? '(?=.*[A-Z])' : '', // has at least one upper case character
+        digit ? '(?=.*\\d)' : '', // has at least one digit
+        specialCharacter ? '(?=.*[!@#$%^&*()])' : '', // has at least one special character
+        !allowRepeat ? '(?!.*(.)\\1(?=\\1{1,}))' : '', // has not an repeated character more than twice
+        `.{${tightCharacterLength},}` // has a length of 8 and more
+      ]
+    : []
+
+  var looseChecklist = useLoosePattern
+    ? [
+        `.{${looseCharacterLength},}` // has a length of 15 and more
+      ]
+    : []
+
+  var checkList = [
+    '^', // from start
+    ...tightChecklist,
+    tightChecklist.length && looseChecklist.length ? '|' : '',
+    ...looseChecklist,
+    '$' //to the end"
+  ]
+
+  return new RegExp(checkList.join(''))
+}

package/src/swipe-listener.ts

@@ -0,0 +1,290 @@
+/**
+ * Starts monitoring swipes on the given element and
+ * emits `swipe` event when a swipe gesture is performed.
+ * @param {DOMElement} element Element on which to listen for swipe gestures.
+ * @param {Object} options Optional: Options.
+ * @return {Object}
+ */
+export function SwipeListener(element: HTMLElement, options?: any) {
+  if (!element) return
+
+  // CustomEvent polyfill
+  if (typeof window !== 'undefined') {
+    ;(function () {
+      if (typeof window.CustomEvent === 'function') return false
+      function CustomEvent(event: string, params: any) {
+        params = params || { bubbles: false, cancelable: false, detail: undefined }
+        var evt = document.createEvent('CustomEvent')
+        evt.initCustomEvent(event, params.bubbles, params.cancelable, params.detail)
+        return evt
+      }
+      CustomEvent.prototype = window.Event.prototype
+      ;(window as any).CustomEvent = CustomEvent
+    })()
+  }
+
+  let defaultOpts = {
+    minHorizontal: 10, // Minimum number of pixels traveled to count as a horizontal swipe.
+    minVertical: 10, // Minimum number of pixels traveled to count as a vertical swipe.
+    deltaHorizontal: 3, // Delta for horizontal swipe
+    deltaVertical: 5, // Delta for vertical swipe
+    preventScroll: false, // Prevents scrolling when swiping.
+    lockAxis: true, // Select only one axis to be true instead of multiple.
+    touch: true, // Listen for touch events
+    mouse: true // Listen for mouse events
+  }
+
+  // Set options
+  if (!options) {
+    options = {}
+  }
+  options = {
+    ...defaultOpts,
+    ...options
+  }
+
+  // Store the touches
+  let touches: Array<{ x: number; y: number }> = []
+
+  // Not dragging by default.
+  let dragging = false
+
+  // When mouse-click is started, make dragging true.
+  const _mousedown = function (e: MouseEvent) {
+    dragging = true
+  }
+
+  // When mouse-click is released, make dragging false and signify end by imitating `touchend`.
+  const _mouseup = function (e: MouseEvent) {
+    dragging = false
+    _touchend(e as any)
+  }
+
+  // When mouse is moved while being clicked, imitate a `touchmove`.
+  const _mousemove = function (e: MouseEvent) {
+    if (dragging) {
+      ;(e as any).changedTouches = [
+        {
+          clientX: e.clientX,
+          clientY: e.clientY
+        }
+      ]
+      _touchmove(e as any)
+    }
+  }
+
+  if (options.mouse) {
+    element.addEventListener('mousedown', _mousedown)
+    element.addEventListener('mouseup', _mouseup)
+    element.addEventListener('mousemove', _mousemove)
+  }
+
+  // When the swipe is completed, calculate the direction.
+  const _touchend = function (e: TouchEvent) {
+    if (!touches.length) return
+
+    const touch = typeof TouchEvent === 'function' && e instanceof TouchEvent
+
+    let x = [],
+      y = []
+
+    let directions = {
+      top: false,
+      right: false,
+      bottom: false,
+      left: false
+    }
+
+    for (let i = 0; i < touches.length; i++) {
+      x.push(touches[i].x)
+      y.push(touches[i].y)
+    }
+
+    const xs = x[0],
+      xe = x[x.length - 1], // Start and end x-coords
+      ys = y[0],
+      ye = y[y.length - 1] // Start and end y-coords
+
+    const eventCoords = {
+      x: [xs, xe],
+      y: [ys, ye]
+    }
+
+    if (touches.length > 1) {
+      const swipeReleaseEventData = {
+        detail: {
+          touch,
+          target: e.target,
+          ...eventCoords
+        }
+      }
+
+      let swipeReleaseEvent = new CustomEvent('swiperelease', swipeReleaseEventData)
+      element.dispatchEvent(swipeReleaseEvent)
+    }
+
+    // Determine left or right
+    let diff = x[0] - x[x.length - 1]
+    let swipe = 'none'
+    if (diff > 0) {
+      swipe = 'left'
+    } else {
+      swipe = 'right'
+    }
+
+    let min = Math.min(...x),
+      max = Math.max(...x),
+      _diff
+
+    // If minimum horizontal distance was travelled
+    if (Math.abs(diff) >= options.minHorizontal) {
+      switch (swipe) {
+        case 'left':
+          _diff = Math.abs(min - x[x.length - 1])
+          if (_diff <= options.deltaHorizontal) {
+            directions.left = true
+          }
+          break
+        case 'right':
+          _diff = Math.abs(max - x[x.length - 1])
+          if (_diff <= options.deltaHorizontal) {
+            directions.right = true
+          }
+          break
+      }
+    }
+
+    // Determine top or bottom
+    diff = y[0] - y[y.length - 1]
+    swipe = 'none'
+    if (diff > 0) {
+      swipe = 'top'
+    } else {
+      swipe = 'bottom'
+    }
+
+    min = Math.min(...y)
+    max = Math.max(...y)
+
+    // If minimum vertical distance was travelled
+    if (Math.abs(diff) >= options.minVertical) {
+      switch (swipe) {
+        case 'top':
+          _diff = Math.abs(min - y[y.length - 1])
+          if (_diff <= options.deltaVertical) {
+            directions.top = true
+          }
+          break
+        case 'bottom':
+          _diff = Math.abs(max - y[y.length - 1])
+          if (_diff <= options.deltaVertical) {
+            directions.bottom = true
+          }
+          break
+      }
+    }
+
+    // Clear touches array.
+    touches = []
+
+    // If there is a swipe direction, emit an event.
+    if (directions.top || directions.right || directions.bottom || directions.left) {
+      /**
+       * If lockAxis is true, determine which axis to select.
+       * The axis with the most travel is selected.
+       * TODO: Factor in for the orientation of the device
+       * and use it as a weight to determine the travel along an axis.
+       */
+      if (options.lockAxis) {
+        if ((directions.left || directions.right) && Math.abs(xs - xe) > Math.abs(ys - ye)) {
+          directions.top = directions.bottom = false
+        } else if ((directions.top || directions.bottom) && Math.abs(xs - xe) < Math.abs(ys - ye)) {
+          directions.left = directions.right = false
+        }
+      }
+
+      const eventData = {
+        detail: {
+          directions,
+          touch,
+          target: e.target,
+          ...eventCoords
+        }
+      }
+
+      let event = new CustomEvent('swipe', eventData)
+      element.dispatchEvent(event)
+    } else {
+      let cancelEvent = new CustomEvent('swipecancel', {
+        detail: {
+          touch,
+          target: e.target,
+          ...eventCoords
+        }
+      })
+      element.dispatchEvent(cancelEvent)
+    }
+  }
+
+  // When a swipe is performed, store the coords.
+  const _touchmove = function (e: TouchEvent) {
+    let touch = e.changedTouches[0]
+    touches.push({
+      x: touch.clientX,
+      y: touch.clientY
+    })
+
+    // Emit a `swiping` event if there are more than one touch-points.
+    if (touches.length > 1) {
+      const xs = touches[0].x, // Start and end x-coords
+        xe = touches[touches.length - 1].x,
+        ys = touches[0].y, // Start and end y-coords
+        ye = touches[touches.length - 1].y,
+        eventData = {
+          detail: {
+            x: [xs, xe],
+            y: [ys, ye],
+            touch: typeof TouchEvent === 'function' && e instanceof TouchEvent,
+            target: e.target
+          }
+        }
+      let event = new CustomEvent('swiping', eventData)
+
+      const shouldPrevent =
+        options.preventScroll === true || (typeof options.preventScroll === 'function' && options.preventScroll(event))
+
+      if (shouldPrevent) {
+        e.preventDefault()
+      }
+
+      element.dispatchEvent(event)
+    }
+  }
+
+  // Test via a getter in the options object to see if the passive property is accessed
+  let passiveOptions: any = false
+  try {
+    const testOptions = Object.defineProperty({}, 'passive', {
+      get: function () {
+        passiveOptions = { passive: !options.preventScroll }
+      }
+    })
+    window.addEventListener('testPassive', null as any, testOptions)
+    window.removeEventListener('testPassive', null as any, testOptions)
+  } catch (e) {}
+
+  if (options.touch) {
+    element.addEventListener('touchmove', _touchmove, passiveOptions)
+    element.addEventListener('touchend', _touchend)
+  }
+
+  return {
+    off: function () {
+      element.removeEventListener('touchmove', _touchmove, passiveOptions)
+      element.removeEventListener('touchend', _touchend)
+      element.removeEventListener('mousedown', _mousedown)
+      element.removeEventListener('mouseup', _mouseup)
+      element.removeEventListener('mousemove', _mousemove)
+    }
+  }
+}