@kalisio/kdk 2.0.0 → 2.1.0

package/core/client/units.js

@@ -0,0 +1,218 @@
+import _ from 'lodash'
+import * as math from 'mathjs'
+import config from 'config'
+import { i18n } from './i18n.js'
+import { Store } from './store.js'
+
+// Default units organised by physical quantity
+// Each key is the internal mathjs "identifier" of the unit
+const length = {
+  m: {
+    symbol: 'units.METER_SYMBOL',
+    label: 'units.METER_LABEL'
+  },
+  mi: {
+    symbol: 'units.MILE_SYMBOL',
+    label: 'units.MILE_LABEL'
+  },
+  NM: {
+    symbol: 'units.NAUTICAL_MILE_SYMBOL',
+    label: 'units.NAUTICAL_MILE_LABEL',
+    definition: '1852 m'
+  }
+}
+const altitude = {
+  m: {
+    symbol: 'units.METER_SYMBOL',
+    label: 'units.METER_LABEL'
+  },
+  ft: {
+    symbol: 'units.FEET_SYMBOL',
+    label: 'units.FEET_LABEL'
+  }
+}
+const area = {
+  'm^2': {
+    symbol: 'units.SQUARED_METER_SYMBOL',
+    label: 'units.SQUARED_METER_LABEL'
+  },
+  'km^2': {
+    symbol: 'units.SQUARED_KILOMETER_SYMBOL',
+    label: 'units.SQUARED_KILOMETER_LABEL'
+  },
+  acre: {
+    symbol: 'units.ACRE_SYMBOL',
+    label: 'units.ACRE_LABEL'
+  },
+  hectare: {
+    symbol: 'units.HECTARE_SYMBOL',
+    label: 'units.HECTARE_LABEL'
+  }
+}
+const velocity = {
+  'm/s': {
+    symbol: 'units.METER_PER_SECOND_SYMBOL',
+    label: 'units.METER_PER_SECOND_LABEL'
+  },
+  'km/h': {
+    symbol: 'units.KILOMETER_PER_HOUR_SYMBOL',
+    label: 'units.KILOMETER_PER_HOUR_LABEL'
+  },
+  'mi/h': {
+    symbol: 'units.MILES_PER_HOUR_SYMBOL',
+    label: 'units.MILES_PER_HOUR_LABEL'
+  },
+  kt: {
+    symbol: 'units.KNOT_SYMBOL',
+    label: 'units.KNOT_LABEL',
+    definition: '0.514444 m/s',
+    override: true // because kt can be kilo ton :(
+  }
+}
+const temperature = {
+  degC: {
+    symbol: 'units.CELSIUS_SYMBOL',
+    label: 'units.CELSIUS_LABEL'
+  },
+  degF: {
+    symbol: 'units.FAHRENHEIT_SYMBOL',
+    label: 'units.FAHRENHEIT_LABEL'
+  },
+  K: {
+    symbol: 'units.KELVIN_SYMBOL',
+    label: 'units.KELVIN_LABEL'
+  }
+}
+const angle = {
+  deg: {
+    symbol: 'units.DEGREE_SYMBOL',
+    label: 'units.DEGREE_LABEL'
+  },
+  rad: {
+    symbol: 'units.RADIAN_SYMBOL',
+    label: 'units.RADIAN_LABEL'
+  }
+}
+
+const quantities = {
+  length,
+  altitude,
+  area,
+  velocity,
+  temperature,
+  angle
+}
+
+// Export singleton
+export const Units = {
+  initialize () {
+    // Set the units object within the store
+    Store.set('units', _.merge(config.units || {},
+      quantities, {
+        default: {
+          length: 'm',
+          altitude: 'm',
+          area: 'm^2',
+          velocity: 'm/s',
+          temperature: 'degC',
+          angle: 'deg',
+          notation: 'auto',
+          precision: 3
+        }
+      }))
+    // Create units not defined by default in mathjs
+    this.getQuantities().forEach(quantity => {
+      this.createUnits(quantity)
+    })
+  },
+  createUnits (quantity) {
+    // Some units are defined according to existing base units
+    // So that we need to create the later ones first
+    const units = _.sortBy(this.getUnits(quantity), [(unit) => (unit.baseName ? 0 : 1)])
+    // Create units not defined by default in mathjs
+    units.forEach(unit => {
+      // Check if already exist first
+      if (math.Unit.isValuelessUnit(unit.name)) {
+        // Maybe we'd like to override it
+        if (!unit.override) return
+      }
+      // If it has any option required by mathjs to create a new unit then proceed
+      if (unit.definition || unit.baseName) {
+        math.createUnit(unit.name, _.omit(unit, ['label', 'override']), { override: _.get(unit, 'override', false) })
+      }
+    })
+  },
+  get () {
+    return Store.get('units')
+  },
+  getDefaultNotation () {
+    return Store.get('units.default.notation', 'auto')
+  },
+  getDefaultPrecision () {
+    return Store.get('units.default.precision', 3)
+  },
+  getQuantities () {
+    return _.keys(_.omit(this.get(), ['default']))
+  },
+  setUnits (quantity, units) {
+    Store.set(`units.${quantity}`, units)
+    this.createUnits(quantity)
+  },
+  getUnits (quantity) {
+    // Get units for a given quantity
+    if (quantity) {
+      const units = Store.get(`units.${quantity}`, {})
+      return _.values(_.mapValues(units, (value, key) => Object.assign({ name: key, quantity }, value)))
+    } else { // Or all units
+      let units = []
+      this.getQuantities().forEach(quantity => {
+        units = units.concat(this.getUnits(quantity))
+      })
+      return units
+    }
+  },
+  getUnit (unit) {
+    return _.find(this.getUnits(), { name: unit })
+  },
+  getUnitSymbol (unit) {
+    const definition = this.getUnit(unit)
+    return (definition ? i18n.t(definition.symbol) : unit)
+  },
+  getDefaultUnit (quantityOrUnit) {
+    // Check for quantity first
+    let defaultUnit = Store.get(`units.default.${quantityOrUnit}`)
+    // If not check by matching quantity based on given unit
+    if (!defaultUnit) {
+      const baseUnit = Units.getUnit(quantityOrUnit)
+      // Get default unit for this quantity instead
+      if (baseUnit) defaultUnit = Units.getDefaultUnit(baseUnit.quantity)
+    }
+    return defaultUnit
+  },
+  convert (value, sourceUnit, targetUnit) {
+    if (sourceUnit === targetUnit) return value
+    let n = math.unit(value, sourceUnit)
+    n = n.toNumber(targetUnit)
+    // Remap from [-180,+180[ to [0,360[ for angles
+    n = (targetUnit === 'deg' ? (n < 0.0 ? n + 360.0 : n) : n)
+    return n
+  },
+  format (value, sourceUnit, targetUnit, options) {
+    // If target unit is not given use default one
+    if (!targetUnit) targetUnit = this.getDefaultUnit(sourceUnit)
+    const n = (targetUnit ? this.convert(value, sourceUnit, targetUnit) : value)
+    // Let options overrides defaults
+    options = Object.assign({
+      symbol: true,
+      notation: this.getDefaultNotation(),
+      precision: this.getDefaultPrecision(),
+      lowerExp: -this.getDefaultPrecision(),
+      upperExp: this.getDefaultPrecision()
+    }, options)
+    let output = math.format(n, options)
+    if (options.symbol) {
+      output += ` ${targetUnit ? this.getUnitSymbol(targetUnit) : this.getUnitSymbol(sourceUnit)}`
+    }
+    return output
+  }
+}

package/core/client/utils/index.js

@@ -0,0 +1,203 @@
+import _ from 'lodash'
+import logger from 'loglevel'
+import moment from 'moment'
+import emailValidator from 'email-validator'
+import { Notify, Dialog, Loading, exportFile } from 'quasar'
+import { defineAsyncComponent, markRaw } from 'vue'
+
+export * from './utils.account.js'
+export * from './utils.colors.js'
+export * from './utils.content.js'
+export * from './utils.locale.js'
+export * from './utils.platform.js'
+export * from './utils.push.js'
+export * from './utils.pwa.js'
+export * from './utils.session.js'
+
+Notify.setDefaults({
+  position: 'bottom-left',
+  timeout: 5000,
+  textColor: 'white'
+})
+
+Loading.setDefaults({
+  spinnerColor: 'primary',
+  spinnerSize: 140,
+  messageColor: 'white',
+  customClass: 'full-width'
+})
+
+/**
+ * This function allow you to modify a JS Promise by adding some status properties.
+ * Based on: http://stackoverflow.com/questions/21485545/is-there-a-way-to-tell-if-an-es6-promise-is-fulfilled-rejected-resolved
+ * But modified according to the specs of promises : https://promisesaplus.com/
+ */
+export function createQuerablePromise (promiseOrExecutor) {
+  let promise = promiseOrExecutor
+  if (typeof promiseOrExecutor === 'function') {
+    promise = new Promise(promiseOrExecutor)
+  }
+  // Don't modify any promise that has been already modified.
+  if (promise.isResolved) return promise
+
+  // Set initial state
+  let isPending = true
+  let isRejected = false
+  let isFulfilled = false
+
+  // Observe the promise, saving the fulfillment in a closure scope.
+  const result = promise.then(
+    (value) => {
+      isFulfilled = true
+      isPending = false
+      return value
+    },
+    (error) => {
+      isRejected = true
+      isPending = false
+      throw error
+    }
+  )
+
+  result.isFulfilled = () => { return isFulfilled }
+  result.isPending = () => { return isPending }
+  result.isRejected = () => { return isRejected }
+
+  return result
+}
+
+export function getInitials (name) {
+  const initials = name.toUpperCase().match(/\b\w/g) || []
+  return initials.join('')
+}
+
+export function isEmailValid (email) {
+  return emailValidator.validate(email)
+}
+
+export function createThumbnail (imageDataUri, width, height, quality, callback) {
+  const image = document.createElement('img')
+  image.onload = function () {
+    const canvas = document.createElement('canvas')
+    const ctx = canvas.getContext('2d')
+    // set its dimension to target size
+    canvas.width = width
+    canvas.height = height
+    ctx.drawImage(this, 0, 0, width, height)
+    callback(canvas.toDataURL('image/jpeg', quality))
+  }
+  image.src = imageDataUri
+}
+
+export function dataUriToBlob (dataUri) {
+  // convert base64 to raw binary data held in a string
+  // doesn't handle URLEncoded DataURIs - see SO answer #6850276 for code that does this
+  const byteString = atob(dataUri.split(',')[1])
+  // separate out the mime component
+  const mimeType = dataUri.split(',')[0].split(':')[1].split(';')[0]
+  // write the bytes of the string to an ArrayBuffer
+  const ab = new ArrayBuffer(byteString.length)
+  // create a view into the buffer
+  const ia = new Uint8Array(ab)
+  // set the bytes of the buffer to the correct values
+  for (let i = 0; i < byteString.length; i++) {
+    ia[i] = byteString.charCodeAt(i)
+  }
+  // write the ArrayBuffer to a blob, and you're done
+  return new Blob([ab], { type: mimeType })
+}
+
+export function downloadAsBlob (data, filename, mimeType) {
+  const blob = new Blob([data], { type: mimeType })
+  exportFile(filename, blob)
+}
+
+// Simplify Quasar dialog plugin usage with async/await
+export async function dialog (options) {
+  return new Promise((resolve, reject) => {
+    Dialog.create(options)
+      .onOk((data) => resolve({ ok: true, data }))
+      .onCancel(() => resolve({ cancel: true }))
+      .onDismiss(() => resolve({ dismiss: true }))
+  })
+}
+
+// Extract icon name from a given icon property on a given target object
+export function getIconName (object, path = 'icon.name') {
+  // Make function work in a generic way, sometimes the provided input is directly the icon name
+  const icon = (typeof object === 'object' ? _.get(object, path, '') : object)
+  // Check whether the returned icon is an object (can be true in some cases)
+  if (typeof icon === 'object') return ''
+  // Name icons to ensure backward compatibility with font awesome 4
+  return (icon.startsWith('fa-') ? `fas ${icon}` : icon)
+}
+
+export function processIcon (object, path = 'icon.name') {
+  // Process icons for backward compatibility with font awesome 4
+  _.set(object, path, getIconName(object, path))
+}
+
+// Function to map kdk icons with QIcon from Quasar
+// https://quasar.dev/vue-components/icon#custom-mapping
+export function mapIconFunction (iconName) {
+  if (iconName.startsWith('kdk:') === true) {
+    // we strip the "kdk:" part
+    const name = iconName.substring(4)
+    // Return the inlined icon
+    return { icon: 'img:icons/kdk/' + name }
+  }
+}
+
+// Transform nested object to dot notation
+export function dotify (object) {
+  const dotifiedObject = {}
+  function recurse (object, current) {
+    _.forOwn(object, (value, key) => {
+      const newKey = (current ? current + '.' + key : key) // joined key with dot
+      if (value && typeof value === 'object') {
+        recurse(value, newKey) // it's a nested object, so do it again
+      } else {
+        dotifiedObject[newKey] = value // it's not an object, so set the property
+      }
+    })
+  }
+
+  recurse(object)
+  return dotifiedObject
+}
+
+// Regular expression that checks for hex value
+const checkForHexRegExp = /^[0-9a-fA-F]{24}$/
+
+// Check if a string is a valid MongoDB Object ID
+export function isObjectID (id) {
+  return (id.length === 24 && checkForHexRegExp.test(id))
+}
+
+// Add UTC offset to timezone name
+export function getTimezoneLabel (timezone) {
+  const offset = moment().tz(timezone).format('Z')
+  return `${timezone} (${offset})`
+}
+
+// Helper function to load a schema
+// @schema alias shoud be added in the quasar.config build section
+export async function loadSchema (schemaName) {
+  try {
+    const schemaModule = await import(`@schemas/${schemaName}.json`)
+    return schemaModule.default
+  } catch (error) {
+    logger.error(error)
+  }
+}
+
+// Helper function to load a component
+// https://vuejs.org/guide/components/async.html
+// @components alias shoud be added in the quasar.config build section
+export function loadComponent (componentName) {
+  try {
+    return markRaw(defineAsyncComponent(() => import(`@components/${componentName}.vue`)))
+  } catch (error) {
+    logger.error(error)
+  }
+}

package/core/client/utils/utils.account.js

@@ -0,0 +1,47 @@
+import { api } from '../api.js'
+
+export function resendVerifySignup (email) {
+  return api.getService('account').create({
+    action: 'resendVerifySignup',
+    value: { email }
+  })
+}
+
+export function verifySignup (token, email) {
+  return api.getService('account').create({
+    action: 'verifySignupShort',
+    value: { user: { email }, token }
+  })
+}
+
+export function sendResetPassword (email) {
+  return api.getService('account').create({
+    action: 'sendResetPwd',
+    value: { email }
+  })
+}
+
+export function resetPassword (email, token, password) {
+  return api.getService('account').create({
+    action: 'resetPwdShort',
+    value: { user: { email }, token, password }
+  })
+}
+
+export function changePassword (email, oldPassword, password) {
+  return api.getService('account').create({
+    action: 'passwordChange',
+    value: { user: { email }, oldPassword, password }
+  })
+}
+
+export function sendChangeIdentity (oldEmail, email, password) {
+  return api.getService('account').create({
+    action: 'identityChange',
+    value: { user: { email: oldEmail }, changes: { email }, password }
+  })
+}
+
+export function changeIdentity (token) {
+  return verifySignup(token)
+}

package/core/client/utils/utils.colors.js

@@ -0,0 +1,36 @@
+import _ from 'lodash'
+
+export const Colors = {
+  dark: '#333',
+  red: '#f44336',
+  pink: '#e91e63',
+  purple: '#9c27b0',
+  'deep-purple': '#673ab7',
+  indigo: '#3f51b5',
+  blue: '#2196f3',
+  'light-blue': '#03a9f4',
+  cyan: '#00bcd4',
+  teal: '#009688',
+  green: '#4caf50',
+  'light-green': '#8bc34a',
+  lime: '#cddc39',
+  yellow: '#ffeb3b',
+  amber: '#ffc107',
+  orange: '#ff9800',
+  'deep-orange': '#ff5722',
+  brown: '#795548',
+  grey: '#9e9e9e',
+  'blue-grey': '#607d8b'
+}
+
+export function getPaletteFromColor (color) {
+  // Check if already a color of the palette
+  if (Colors[color]) return color
+  else return _.findKey(Colors, item => item === color) || 'white'
+}
+
+export function getColorFromPalette (color) {
+  // Check if already a RGB color
+  if (color.startsWith('#')) return color
+  else return Colors[color] || '#ffffff'
+}

package/core/client/utils/utils.content.js

@@ -0,0 +1,185 @@
+import _ from 'lodash'
+import logger from 'loglevel'
+import sift from 'sift'
+import { Store } from '../store.js'
+
+const Handlers = ['handler', 'visible', 'hidden', 'disabled', 'on.listener']
+// Some bindings are not managed when reading content from config but externally on-demand, e.g. by KContent or KAction
+// The content 'reserved' property is also used to recurse at caller level
+const ReservedBindings = ['content', 'visible', 'hidden', 'route']
+
+// Check if an object has a property according to its path.
+// Similar to lodash has function which causes a bug in production build with Vue proxy objects
+// It appears that with proxy objects it is safer to use the in operator or Reflect.has()
+function hasProperty (object, path) {
+  const keys = path.split('.')
+  let currentObject = object
+  for (const key of keys) {
+    if (!currentObject || !(key in currentObject)) {
+      return false
+    }
+    currentObject = currentObject[key]
+  }
+  return true
+}
+
+export function filterContent (content, filter) {
+  // Handle non object content
+  if (typeof content !== 'object') return content
+  // Handle array and object case
+  const isArray = Array.isArray(content)
+  const modes = _.keys(content)
+  let filteredContent = content
+  if (!isArray) {
+    // Recurse ?
+    if (filteredContent.content) {
+      filteredContent.content = filterContent(filteredContent.content, filter)
+    } else {
+      modes.forEach(mode => {
+        const contentForMode = filteredContent[mode]
+        filteredContent[mode] = filterContent(contentForMode, filter)
+      })
+    }
+    filteredContent = [filteredContent]
+  } else {
+    filteredContent.forEach(item => {
+      // Recurse ?
+      if (item.content) {
+        item.content = filterContent(item.content, filter)
+      }
+    })
+  }
+  // Apply filtering
+  filteredContent = filteredContent.filter(sift(filter))
+  return (isArray ? filteredContent : filteredContent[0])
+}
+
+// Perform binding between a configuration object and a given context object
+export function bindContent (content, context, omit = []) {
+  const components = _.flatMapDeep(content)
+  _.forEach(components, (component) => {
+    // Process component handlers
+    Handlers.forEach(handler => bindHandler(component, handler, context))
+    // Then process component props
+    // It allows to write any property like { label: ':xxx' } and bind it
+    // to a component property from the context like we do for handler
+    bindProperties(component, context, omit)
+    // Recursively bind the props/handlers on the sub content object
+    if (component.content) bindContent(component.content, context, omit)
+  })
+  return content
+}
+
+export function bindProperties (item, context, omit = []) {
+  if (Array.isArray(item)) {
+    for (let i = 0; i < item.length; i++) {
+      item[i] = bindProperties(item[i], context)
+    }
+  } else if (typeof item === 'object') {
+    _.forOwn(item, (value, key) => {
+      // Bind required properties only
+      if (!ReservedBindings.includes(key) && !omit.includes(key)) {
+        if (typeof value === 'string') {
+          item[key] = getBoundValue(value, context)
+        } else {
+          item[key] = bindProperties(value, context)
+        }
+      }
+    })
+  }
+  return item
+}
+
+export function bindHandler (component, path, context) {
+  const handler = _.get(component, path)
+  // Could be an array if multiple handlers to be called
+  if (Array.isArray(handler)) {
+    // Process all array elements, manage the case where the handler is simply a function/property name
+    const handlers = handler.map(h => generateHandler(context, h.name || h, h.params))
+    // In that specific case the result is a boolean AND operation
+    _.set(component, path, (...args) => handlers.reduce((result, h) => result && h(...args), true))
+  } else if (handler && typeof handler === 'object') {
+    // Could be a structure with name and possibly params specified
+    // :xxx is reserved for binding to internal property not function call
+    if (handler.name) {
+      if (!handler.name.startsWith(':')) {
+        _.set(component, path, generateHandler(context, handler.name, handler.params))
+      }
+    } else {
+      logger.debug(`[KDK] invalid handler binding for ${handler}: you must provide the name to the function to be called`)
+    }
+  } else if ((typeof handler === 'string') && !handler.startsWith(':')) {
+    // Or only name if no params are specified
+    // :xxx is reserved for binding to internal property not function call
+    _.set(component, path, generateHandler(context, handler))
+  }
+  // Get back processed handler function
+  return _.get(component, path)
+}
+
+export function generateHandler (context, name, params) {
+  // When the handler can be a simple getter, eg is visible use case,
+  // we allow a property value instead of a function and a logical NOT
+  const isNot = name.startsWith('!')
+  if (isNot) name = name.substring(1)
+  return (...args) => {
+    let result
+    const handler = _.get(context, name)
+    // Function call or property value read ?
+    if (typeof handler === 'function') {
+      // Provided parameters or simply forward arguments ?
+      result = (params ? handler(...bindParams(params, context)) : handler(...args))
+    } else {
+      result = handler
+    }
+    // Logical NOT to be performed ?
+    return (isNot ? !result : result)
+  }
+}
+
+export function bindParams (params, context) {
+  // A parameter like :xxx means xxx is a property of the component, not a static value
+  // In that case remove trailing : and get property value dynamically
+  if (_.isNil(params)) {
+    return params
+  } else if (Array.isArray(params)) {
+    return params.map(param => bindParams(param, context))
+  } else if (typeof params === 'object') {
+    return _.mapValues(params, (value, key) => bindParams(value, context))
+  } else {
+    return getBoundValue(params, context)
+  }
+}
+
+export function getBoundValue (value, context) {
+  if ((typeof value === 'string') && value.startsWith(':')) {
+    // From store or context ?
+    if (value.startsWith(':store.')) {
+      const path = value.replace(':store.', '')
+      if (Store.has(path)) return Store.get(path)
+    } else if (value.startsWith(':storeRef.')) {
+      const path = value.replace(':storeRef.', '')
+      // FIXME: we should test if the path exists but this causes
+      // a bug in production build with Vue proxy objects
+      // if (Store.has(path)) return Store.getRef(path)
+      if (hasProperty(Store, path)) return Store.getRef(path)
+      // Workaround if not possible to correctly check the path first
+      // but it causes problems with values initialized to null
+      // const result = Store.getRef(path)
+      // if (!_.isNil(result)) return result
+    } else {
+      const path = value.substring(1)
+      // FIXME: we should test if the path exists but this causes
+      // a bug in production build with Vue proxy objects
+      // if (_.has(context, path)) return _.get(context, path)
+      if (hasProperty(context, path)) return _.get(context, path)
+      // Workaround if not possible to correctly check the path first
+      // but it causes problems with values initialized to null
+      // const result = _.get(context, path)
+      // if (!_.isNil(result)) return result
+    }
+    // Bound value not found
+    return undefined
+  }
+  return value
+}