@websy/websy-designs 1.10.0 → 1.10.2

package/dist/server/routes/v1/api.js

@@ -3,7 +3,7 @@ const router = express.Router()
 // const PG = require('../helpers/dbHelper')
 // const dbHelper = new PG()
 
-function APIRoutes (dbHelper, authHelper) {  
+function APIRoutes (dbHelper, authHelper) {
   router.delete('/:entity/:id', (req, res) => {
     const sql = `DELETE FROM ${req.params.entity} WHERE ${dbHelper.buildWhereWithId(req.params.entity, req.params.id)}`
     dbHelper.execute(sql).then(response => res.json(response), err => res.json(err))
@@ -12,6 +12,18 @@ function APIRoutes (dbHelper, authHelper) {
     const sql = dbHelper.buildDelete(req.params.entity, req.query.where)
     dbHelper.execute(sql).then(response => res.json(response), err => res.json(err))
   })
+  router.get('/currentuser', (req, res) => {
+    let user = {}
+    if (req.session && req.session.user) {
+      user = req.session.user
+    }
+    if (process.env.SENSITIVE_USERPROPS) {
+      process.env.SENSITIVE_USERPROPS.split(',').forEach(d => {
+        delete user[d.trim()]
+      })
+    }
+    res.json(user)
+  })
   router.get('/:entity/:id', (req, res) => {
     let lang = process.env.DEFAULT_LANGUAGE
     if (req.session && req.session.language && req.query.notranslate !== 'true') {
@@ -49,7 +61,6 @@ function APIRoutes (dbHelper, authHelper) {
       user = req.session.user
     }
     const sql = dbHelper.buildUpsert(req.params.entity, req.body, user)
-    console.log('upsert sql', sql)
     dbHelper.execute(sql).then(response => res.json(response), err => res.json(err))
   })
   router.post('/:entity', authHelper.checkPermissions, (req, res) => {

package/dist/websy-designs-es6.debug.js

@@ -1559,6 +1559,7 @@ class WebsyDropdown {
       closeAfterSelection: true,
       customActions: [],
       customButtons: [],
+      minWidth: 220,
       searchIcon: `<svg width="20" height="20" viewBox="0 0 512 512"><path d="M221.09,64A157.09,157.09,0,1,0,378.18,221.09,157.1,157.1,0,0,0,221.09,64Z" style="fill:none;stroke:#000;stroke-miterlimit:10;stroke-width:32px"/><line x1="338.29" y1="338.29" x2="448" y2="448" style="fill:none;stroke:#000;stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px"/></svg>`,
       clearIcon: `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 512 512"><title>ionicons-v5-l</title><line x1="368" y1="368" x2="144" y2="144" style="fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/><line x1="368" y1="144" x2="144" y2="368" style="fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"/></svg>`,
       arrowIcon: `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M23.677 18.52c.914 1.523-.183 3.472-1.967 3.472h-19.414c-1.784 0-2.881-1.949-1.967-3.472l9.709-16.18c.891-1.483 3.041-1.48 3.93 0l9.709 16.18z"/></svg>`,
@@ -1585,7 +1586,7 @@ class WebsyDropdown {
       el.addEventListener('click', this.handleClick.bind(this))
       el.addEventListener('keyup', this.handleKeyUp.bind(this))
       el.addEventListener('mouseout', this.handleMouseOut.bind(this))
-      el.addEventListener('mousemove', this.handleMouseMove.bind(this))      
+      el.addEventListener('mousemove', this.handleMouseMove.bind(this))
       const headerLabel = this.selectedItems.map(s => this.options.items[s].label || this.options.items[s].value).join(this.options.multiValueDelimiter)
       const headerValue = this.selectedItems.map(s => this.options.items[s].value || this.options.items[s].label).join(this.options.multiValueDelimiter)
       let html = `
@@ -1670,6 +1671,15 @@ class WebsyDropdown {
         </div>
       `
       el.innerHTML = html
+      const maskEl = document.getElementById(`${this.elementId}_mask`)
+      if (maskEl) {      
+        maskEl.addEventListener('mousewheel', event => {
+          if (event.target.classList.contains('websy-dropdown-mask')) {
+            event.preventDefault()
+            event.stopPropagation()
+          }
+        })   
+      }
       const scrollEl = document.getElementById(`${this.elementId}_itemsContainer`)
       if (scrollEl) {
         scrollEl.addEventListener('scroll', this.handleScroll.bind(this))
@@ -1900,7 +1910,7 @@ class WebsyDropdown {
     const contentPos = WebsyUtils.getElementPos(contentEl)    
     if (this.options.style === 'plain' && headerPos.width > 0 && headerPos.height > 0) {
       contentEl.style.right = `calc(100vw - ${headerPos.right}px)`
-      contentEl.style.width = `${headerEl.clientWidth}px`
+      contentEl.style.width = `${Math.max(this.options.minWidth, headerEl.clientWidth)}px`
       if (headerPos.bottom + contentPos.height > window.innerHeight) {
         // contentEl.classList.add('on-top')
         contentEl.style.bottom = `calc(100vh - ${headerPos.top}px)`
@@ -1912,7 +1922,7 @@ class WebsyDropdown {
     else if (this.options.style === 'plain' && headerPos.width === 0 && headerPos.height === 0) {
       const targetPos = WebsyUtils.getElementPos(event.target)
       contentEl.style.right = `calc(100vw - ${targetPos.right}px)`  
-      contentEl.style.width = `${targetPos.width}px`
+      contentEl.style.width = `${Math.max(this.options.minWidth, targetPos.width)}px`
     }
     if (this.options.disableSearch !== true) {
       const searchEl = document.getElementById(`${this.elementId}_search`)
@@ -3508,7 +3518,9 @@ class WebsyPDFButton {
       classes: [],
       wait: 0,
       buttonText: 'Download',
-      directDownload: false
+      directDownload: false,
+      preProcess: (callbackFn) => (callbackFn(true)),
+      onError: () => {}
     }
     this.elementId = elementId
     this.options = Object.assign({}, DEFAULTS, options)
@@ -3566,87 +3578,95 @@ class WebsyPDFButton {
   handleClick (event) {
     if (event.target.classList.contains('websy-pdf-button')) {
       this.loader.show()
-      setTimeout(() => {        
-        if (this.options.targetId) {
-          const el = document.getElementById(this.options.targetId)
-          if (el) {
-            const pdfData = { options: {} }
-            if (this.options.pdfOptions) {
-              pdfData.options = Object.assign({}, this.options.pdfOptions)
-            }
-            if (this.options.header) {
-              if (this.options.header.elementId) {
-                const headerEl = document.getElementById(this.options.header.elementId)
-                if (headerEl) {
-                  pdfData.header = headerEl.outerHTML  
-                  if (this.options.header.css) {
-                    pdfData.options.headerCSS = this.options.header.css
-                  }
+      this.options.preProcess((proceed) => {
+        if (proceed === true) {          
+          setTimeout(() => {        
+            if (this.options.targetId) {
+              const el = document.getElementById(this.options.targetId)
+              if (el) {
+                const pdfData = { options: {} }
+                if (this.options.pdfOptions) {
+                  pdfData.options = Object.assign({}, this.options.pdfOptions)
                 }
-              }
-              else if (this.options.header.html) {
-                pdfData.header = this.options.header.html
-                if (this.options.header.css) {
-                  pdfData.options.headerCSS = this.options.header.css
-                }
-              }
-              else {
-                pdfData.header = this.options.header
-              }
-            }
-            if (this.options.footer) {
-              if (this.options.footer.elementId) {
-                const footerEl = document.getElementById(this.options.footer.elementId)
-                if (footerEl) {
-                  pdfData.footer = footerEl.outerHTML  
-                  if (this.options.footer.css) {
-                    pdfData.options.footerCSS = this.options.footer.css
+                if (this.options.header) {
+                  if (this.options.header.elementId) {
+                    const headerEl = document.getElementById(this.options.header.elementId)
+                    if (headerEl) {
+                      pdfData.header = headerEl.outerHTML  
+                      if (this.options.header.css) {
+                        pdfData.options.headerCSS = this.options.header.css
+                      }
+                    }
+                  }
+                  else if (this.options.header.html) {
+                    pdfData.header = this.options.header.html
+                    if (this.options.header.css) {
+                      pdfData.options.headerCSS = this.options.header.css
+                    }
+                  }
+                  else {
+                    pdfData.header = this.options.header
                   }
                 }
-              }
-              else {
-                pdfData.footer = this.options.footer
-              }
-            }
-            pdfData.html = el.outerHTML
-            // document.getElementById(`${this.elementId}_pdfHeader`).value = pdfData.header
-            // document.getElementById(`${this.elementId}_pdfHTML`).value = pdfData.html
-            // document.getElementById(`${this.elementId}_pdfFooter`).value = pdfData.footer
-            // document.getElementById(`${this.elementId}_form`).submit()
-            this.service.add('', pdfData, {responseType: 'blob'}).then(response => {
-              this.loader.hide()
-              const blob = new Blob([response], {type: 'application/pdf'})
-              let msg = `
-                <div class='text-center websy-pdf-download'>
-                  <div>Your file is ready to download</div>
-                  <a href='${URL.createObjectURL(blob)}' target='_blank'
-              `
-              if (this.options.directDownload === true) {
-                let fileName
-                if (typeof this.options.fileName === 'function') {
-                  fileName = this.options.fileName() || 'Export'
+                if (this.options.footer) {
+                  if (this.options.footer.elementId) {
+                    const footerEl = document.getElementById(this.options.footer.elementId)
+                    if (footerEl) {
+                      pdfData.footer = footerEl.outerHTML  
+                      if (this.options.footer.css) {
+                        pdfData.options.footerCSS = this.options.footer.css
+                      }
+                    }
+                  }
+                  else {
+                    pdfData.footer = this.options.footer
+                  }
                 }
-                else {
-                  fileName = this.options.fileName || 'Export'
-                }                
-                msg += `download='${fileName}.pdf'`
+                pdfData.html = el.outerHTML
+                // document.getElementById(`${this.elementId}_pdfHeader`).value = pdfData.header
+                // document.getElementById(`${this.elementId}_pdfHTML`).value = pdfData.html
+                // document.getElementById(`${this.elementId}_pdfFooter`).value = pdfData.footer
+                // document.getElementById(`${this.elementId}_form`).submit()
+                this.service.add('', pdfData, {responseType: 'blob'}).then(response => {
+                  this.loader.hide()
+                  const blob = new Blob([response], {type: 'application/pdf'})
+                  let msg = `
+                    <div class='text-center websy-pdf-download'>
+                      <div>Your file is ready to download</div>
+                      <a href='${URL.createObjectURL(blob)}' target='_blank'
+                  `
+                  if (this.options.directDownload === true) {
+                    let fileName
+                    if (typeof this.options.fileName === 'function') {
+                      fileName = this.options.fileName() || 'Export'
+                    }
+                    else {
+                      fileName = this.options.fileName || 'Export'
+                    }                
+                    msg += `download='${fileName}.pdf'`
+                  }
+                  msg += `
+                      >
+                        <button class='websy-btn download-pdf'>${this.options.buttonText}</button>
+                      </a>
+                    </div>
+                  `
+                  this.popup.show({
+                    message: msg,
+                    mask: true
+                  })
+                }, err => {
+                  console.error(err)
+                })
               }
-              msg += `
-                  >
-                    <button class='websy-btn download-pdf'>${this.options.buttonText}</button>
-                  </a>
-                </div>
-              `
-              this.popup.show({
-                message: msg,
-                mask: true
-              })
-            }, err => {
-              console.error(err)
-            })
-          }
-        } 
-      }, this.options.wait)           
+            } 
+          }, this.options.wait)           
+        }
+        else {
+          this.loader.hide()
+          this.options.onError()
+        }
+      })
     }
     else if (event.target.classList.contains('download-pdf')) {
       this.popup.hide()
@@ -5267,10 +5287,12 @@ const WebsyUtils = {
     const scrollLeft = window.pageXOffset || document.documentElement.scrollLeft
     const scrollTop = window.pageYOffset || document.documentElement.scrollTop
     return { 
-      top: rect.top + scrollTop,
-      left: rect.left + scrollLeft,
-      bottom: rect.top + scrollTop + el.clientHeight,
-      right: rect.left + scrollLeft + el.clientWidth,
+      top: rect.top, // + scrollTop,
+      left: rect.left, // + scrollLeft,
+      // bottom: rect.top + scrollTop + el.clientHeight,
+      bottom: rect.top + el.clientHeight,
+      // right: rect.left + scrollLeft + el.clientWidth,
+      right: rect.left + el.clientWidth,
       width: rect.width,
       height: rect.height
     }
@@ -5458,6 +5480,7 @@ class WebsyTable {
     this.busy = false
     this.tooltipTimeoutFn = null
     this.data = []
+    this._isRendered = false
     const el = document.getElementById(this.elementId)
     if (el) {
       let html = `
@@ -5517,7 +5540,11 @@ class WebsyTable {
       console.error(`No element found with ID ${this.elementId}`)
     }
   }
+  get isRendered () {
+    return this._isRendered
+  }
   appendRows (data) {
+    this._isRendered = false
     this.hideError()
     let bodyHTML = ''
     if (data) {
@@ -5594,6 +5621,7 @@ class WebsyTable {
     }
     const bodyEl = document.getElementById(`${this.elementId}_body`)
     bodyEl.innerHTML += bodyHTML
+    this._isRendered = true
   }
   buildSearchIcon (field) {
     return `
@@ -5733,6 +5761,7 @@ class WebsyTable {
     this.render(this.data)
   } 
   render (data) {
+    this._isRendered = false
     if (!this.options.columns) {
       return
     }
@@ -6447,6 +6476,7 @@ class WebsyTable3 {
       autoFitColumns: true
     }
     this.options = Object.assign({}, DEFAULTS, options)
+    this._isRendered = false
     this.isTouchDevice = ('ontouchstart' in window) || (navigator.maxTouchPoints > 0) || (navigator.msMaxTouchPoints > 0)
     if (this.options.disableTouch === true) {
       this.isTouchDevice = false
@@ -6541,6 +6571,9 @@ class WebsyTable3 {
       console.error(`No element found with ID ${this.elementId}`)
     }
   }
+  get isRendered () {
+    return this._isRendered
+  }
   set columns (columns) {
     this.options.columns = columns
     this.renderColumnHeaders()
@@ -6550,6 +6583,7 @@ class WebsyTable3 {
     this.renderTotals()
   }
   appendRows (data) {
+    this._isRendered = false
     this.hideError()    
     let bodyEl = document.getElementById(`${this.elementId}_tableBody`)    
     if (bodyEl) {
@@ -6563,6 +6597,7 @@ class WebsyTable3 {
         }        
         else {
           bodyEl.innerHTML += this.buildBodyHtml(data, true)
+          this._isRendered = true
         }
         this.currentData = this.currentData.concat(data)
       }
@@ -7564,10 +7599,12 @@ class WebsyChart {
       maxBandWidth: 100,
       allowUnevenBands: true,
       allowBrushing: true,
-      balancedMinMax: false
+      balancedMinMax: false,
+      onRendered: () => {}
     }
     this.elementId = elementId
     this.options = Object.assign({}, DEFAULTS, options)
+    this._isRendered = false
     this.leftAxis = null
     this.rightAxis = null
     this.topAxis = null
@@ -7606,21 +7643,6 @@ class WebsyChart {
           }
         }
       }
-      // }
-      // else {        
-      //   let domain = [...this[xAxis].domain()]
-      //   if (this.options.orientation === 'horizontal') {
-      //     domain = domain.reverse()
-      //   }      
-      //   for (let j = 0; j < domain.length; j++) {                
-      //     let breakA = this[xAxis](domain[j]) - (width / 2)
-      //     let breakB = breakA + width
-      //     if (input > breakA && input <= breakB) {       
-      //       output = j
-      //       break
-      //     }
-      //   } 
-      // }
       return output
     }  
     let that = this 
@@ -7707,6 +7729,9 @@ class WebsyChart {
     this.options.data = d
     this.render()
   }
+  get isRendered () {
+    return this._isRendered
+  }
   close () {
     this.leftAxisLayer && this.leftAxisLayer.selectAll('*').remove()
     this.rightAxisLayer && this.rightAxisLayer.selectAll('*').remove()
@@ -8017,6 +8042,7 @@ this.render()
   }
   render (options) {
     /* global d3 options WebsyUtils */ 
+this._isRendered = false
 if (typeof options !== 'undefined') {
   this.options = Object.assign({}, this.options, options)
   if (this.options.legendOptions) {
@@ -8883,6 +8909,7 @@ this.refLineLayer.selectAll('.reference-line-label').remove()
 if (this.options.refLines && this.options.refLines.length > 0) {
   this.options.refLines.forEach(l => this.renderRefLine(l))
 }
+this._isRendered = true
 
   }
   renderarea (series, index) {
@@ -9886,9 +9913,14 @@ class WebsyKPI {
     }
     this.elementId = elementId
     this.options = Object.assign({}, DEFAULTS, options)
+    this._isRendered = false
     this.render()
   }
+  get isRendered () {
+    return this._isRendered
+  }
   render (options) {
+    this._isRendered = false
     this.options = Object.assign({}, this.options, options)
     if (!this.options.label.classes) {
       this.options.label.classes = []
@@ -9941,6 +9973,7 @@ class WebsyKPI {
         </div>
       `
       el.innerHTML = html
+      this._isRendered = true
     }
   }  
 }
@@ -9962,6 +9995,7 @@ class WebsyMap {
     }
     this.elementId = elementId
     this.options = Object.assign({}, DEFAULTS, options)
+    this._isRendered = false
     if (!elementId) {
       console.log('No element Id provided for Websy Map')		
       return
@@ -9993,6 +10027,9 @@ class WebsyMap {
       this.render()
     }
   }
+  get isRendered () {
+    return this._isRendered
+  }
   handleClick (event) {
 
   }
@@ -10000,6 +10037,7 @@ class WebsyMap {
 
   }
   render () {
+    this._isRendered = false
     const mapEl = document.getElementById(`${this.elementId}_map`)
     const legendEl = document.getElementById(`${this.elementId}_map`)
     if (this.options.showLegend === true && this.options.data.polygons) {            
@@ -10131,6 +10169,7 @@ class WebsyMap {
     else if (this.options.center) {
       this.map.setView(this.options.center, this.options.zoom || null)
     }
+    this._isRendered = true
   }
 }