material 0.7.0 → 0.7.2

package/src/list/render.js

@@ -23,7 +23,7 @@ export default {
     // console.log('renderItem', info)
     info = info || {}
 
-    var container = this.ui.body
+    const container = this.ui.body
 
     if (context === 'create') {
       container.scrolltop = 0
@@ -33,7 +33,7 @@ export default {
     //   container = this.ui['search-list']
     // }
 
-    var element = new Element({
+    const element = new Element({
       tag: 'li',
       class: 'item'
     })
@@ -47,10 +47,10 @@ export default {
     element.dataset.id = info[this.dataId]
     element.dataset.info = this.options.info
 
-    var layout = null
+    let layout = null
 
     if (this.options.itemSwitch) {
-      var item = info[this.options.itemSwitch]
+      const item = info[this.options.itemSwitch]
 
       if (this.options.layout.item[item]) {
         layout = new Layout(this.options.layout.item[item], element)
@@ -58,7 +58,7 @@ export default {
         layout = new Layout(this.options.layout.item.base, element)
       }
     } else {
-      var itemName = this.options.itemName || 'item'
+      const itemName = this.options.itemName || 'item'
       layout = new Layout(this.options.layout[itemName], element)
     }
 
@@ -91,11 +91,11 @@ export default {
    */
   renderInfo (layout, object) {
     // console.log('renderInfo', object)
-    var info = dot(object)
+    const info = dot(object)
 
-    var f = this.extractInfo(layout.component)
+    const f = this.extractInfo(layout.component)
 
-    for (var field in f) {
+    for (const field in f) {
       if (f.hasOwnProperty(field)) {
         if (f[field] && f[field].set) {
           f[field].set(this.objectValueByDotKey(object, field))
@@ -108,11 +108,11 @@ export default {
   },
 
   objectValueByDotKey (object, dotkey) {
-    var keys = dotkey.split(/\./)
+    const keys = dotkey.split(/\./)
 
-    var value = Object.assign({}, object)
+    let value = Object.assign({}, object)
 
-    for (var i = 0; i < keys.length; i++) {
+    for (let i = 0; i < keys.length; i++) {
       if (value !== undefined) {
         value = value[keys[i]]
       }
@@ -124,14 +124,14 @@ export default {
   extractInfo (object) {
     // console.log('extractField', object)
 
-    var field = {}
+    const field = {}
 
-    for (var property in object) {
+    for (const property in object) {
       if (object.hasOwnProperty(property)) {
-        var infos = property.split(/\./)
+        const infos = property.split(/\./)
 
         if (infos[0] === 'info' && infos[1] !== undefined) {
-          var name = property.substr(5, property.length)
+          const name = property.substr(5, property.length)
           // console.log('field', name, property)
 
           field[name] = object[property]

package/src/list/request.js

@@ -16,7 +16,7 @@ export default {
     }
 
     this.data = this.data || []
-    var signal = null
+    let signal = null
 
     if (this.abortController) {
       // console.log('abort')
@@ -37,7 +37,7 @@ export default {
       this.ui.body.scrolltop = 0
     }
 
-    var route = this.buildRoute(page, size)
+    const route = this.buildRoute(page, size)
 
     if (more !== true && this.options.count) {
       this.requestCount(route)
@@ -45,7 +45,7 @@ export default {
 
     // console.log('route - ', this.rand, route)
 
-    fetch(route, {signal}).then((resp) => {
+    fetch(route, { signal }).then((resp) => {
       return resp.json()
     }).then((data) => {
       if (this.options.debug) {
@@ -68,7 +68,7 @@ export default {
       }
 
       if (more === true) {
-        var a = this.data.concat(data)
+        const a = this.data.concat(data)
         this.data = a
         this.storeData(data, more)
         this.virtual.add(this.data)
@@ -95,7 +95,7 @@ export default {
 
   requestCount (route, signal) {
     // console.log('fetchCount', route)
-    fetch(route + '&count=1', {signal}).then((resp) => {
+    fetch(route + '&count=1', { signal }).then((resp) => {
       return resp.json()
     }).then((data) => {
       // console.log('data', data.count)
@@ -137,7 +137,7 @@ export default {
     page = page || 1
     size = size || this.options.list.size
 
-    var route = this.options.route
+    let route = this.options.route
 
     if (path) {
       route = this.options.route[path]
@@ -154,7 +154,7 @@ export default {
 
     }
 
-    if (this.ui.filter && this.ui.filter.root.classList.contains('selected')) {
+    if (this.ui.filter && this.ui.filter.element.classList.contains('selected')) {
       route = this.addParams(route, this.getFilter())
     }
 
@@ -174,7 +174,7 @@ export default {
     // console.log('storeData', this.dataStore)
     this.dataStore = this.dataStore || {}
 
-    for (var i = 0; i < list.length; i++) {
+    for (let i = 0; i < list.length; i++) {
       this.dataList.push(list[i][this.dataId])
       this.dataStore[list[i][this.dataId]] = list[i]
     }

package/src/list/search.js

@@ -15,7 +15,7 @@ export default {
     }
 
     this.data = this.data || []
-    var signal = null
+    let signal = null
 
     if (this.abortController) {
       this.abortController.abort()
@@ -34,7 +34,7 @@ export default {
       this.ui.body.scrolltop = 0
     }
 
-    var route = this.buildRoute(page, size, 'search')
+    let route = this.buildRoute(page, size, 'search')
 
     route = this.addParams(route, 'search=' + keywords)
 
@@ -44,7 +44,7 @@ export default {
       this.requestCount(route)
     }
 
-    fetch(route, {signal}).then((resp) => {
+    fetch(route, { signal }).then((resp) => {
       return resp.json()
     }).then((data) => {
       // console.log('data', data)
@@ -64,7 +64,7 @@ export default {
       }
 
       if (more === true) {
-        var a = this.data.concat(data)
+        const a = this.data.concat(data)
         this.data = a
         this.storeData(data, more)
         this.virtual.add(this.data)
@@ -93,7 +93,7 @@ export default {
   toggleSearch (e) {
     e.stopPropagation()
     // console.log('toggle search', this.ui.body)
-    if (!this.ui['search-input'].root.classList.contains('show')) {
+    if (!this.ui['search-input'].element.classList.contains('show')) {
       this.showSearch()
     } else {
       this.hideSearch()
@@ -114,13 +114,13 @@ export default {
     this.element.classList.add('search-mode')
 
     if (this.ui.search) {
-      this.ui.search.root.classList.add('selected')
+      this.ui.search.element.classList.add('selected')
     }
 
     if (this.ui['search-input']) {
-      this.ui['search-input'].input.value = ''
-      this.ui['search-input'].root.classList.add('show')
-      this.ui['search-input'].input.focus()
+      this.ui['search-input'].set()
+      this.ui['search-input'].show()
+      this.ui['search-input'].focus()
     }
 
     this.ui.body.innerHTML = ''
@@ -139,11 +139,11 @@ export default {
     this.element.classList.remove('search-mode')
 
     if (this.ui.search) {
-      this.ui.search.root.classList.remove('selected')
+      this.ui.search.element.classList.remove('selected')
     }
     if (this.ui['search-input']) {
-      this.ui['search-input'].root.classList.remove('show')
-      this.ui['search-input'].input.value = ''
+      this.ui['search-input'].hide()
+      this.ui['search-input'].set()
     }
     // this.ui['search-list'].classList.remove('show')
     // this.ui.body.classList.remove('hide')

package/src/list/select.js

@@ -3,7 +3,7 @@ export default {
     // console.log('select', item.dataset.id)
     if (!item || !item.dataset.id) return
 
-    var id = item.dataset.id
+    const id = item.dataset.id
 
     this.index = this.dataList.indexOf(id)
     this.info = this.dataStore[id]
@@ -12,7 +12,7 @@ export default {
       return
     }
 
-    var selected = this.ui.body.querySelector('.selected')
+    const selected = this.ui.body.querySelector('.selected')
     if (selected) selected.classList.remove('selected')
 
     if (id) {
@@ -32,7 +32,7 @@ export default {
 
   unselect () {
     // console.log('unselect')
-    var item = this.ui.body.querySelector('[data-id="' + this.id + '"]') || this.item
+    const item = this.ui.body.querySelector('[data-id="' + this.id + '"]') || this.item
     this.id = null
     if (item) {
       item.classList.remove('selected')
@@ -51,7 +51,7 @@ export default {
 
   getItemById (id, silent) {
     // console.log('selectItemById', id)
-    var item = this.ui.body.querySelector('[data-id="' + id + '"]')
+    const item = this.ui.body.querySelector('[data-id="' + id + '"]')
 
     if (!item) {
       return null
@@ -67,7 +67,7 @@ export default {
       return false
     }
 
-    var index = this.dataList.indexOf(id)
+    const index = this.dataList.indexOf(id)
     if (index < 0) {
       // console.log('can\'t selectid, not in the list')
       return false
@@ -83,16 +83,16 @@ export default {
 
   selectItemById (id, direction) {
     // console.log('selectItemById', id)
-    var item = this.ui.body.querySelector('[data-id="' + id + '"]')
+    const item = this.ui.body.querySelector('[data-id="' + id + '"]')
 
     this.id = id
 
     if (!item) {
-      var index = this.dataList.indexOf(id)
+      const index = this.dataList.indexOf(id)
       // console.log('not found in DOM, check in dataList', index)
       if (index > -1) {
-        var listSize = this.options.list.size
-        var slice = listSize * index / listSize
+        const listSize = this.options.list.size
+        const slice = listSize * index / listSize
         // console.log('getSlice', slice)
       }
 
@@ -103,7 +103,7 @@ export default {
 
     // if (this.item) this.item.classList.remove('selected')
 
-    var selected = this.ui.body.querySelector('.selected')
+    const selected = this.ui.body.querySelector('.selected')
     if (selected) selected.classList.remove('selected')
 
     this.item = item
@@ -118,7 +118,7 @@ export default {
   },
 
   selectPosition (item, direction) {
-    var offsetY = this.options.item.height
+    const offsetY = this.options.item.height
     direction = direction || 'down'
     // console.log('selectPosition', this.ui.body, direction)
 
@@ -126,12 +126,12 @@ export default {
 
     // console.log('coord', this.coord)
 
-    var itemTop = item.offsetTop + this.coord.top - this.ui.body.scrollTop
+    const itemTop = item.offsetTop + this.coord.top - this.ui.body.scrollTop
 
     if (direction === 'down' && itemTop + this.options.item.height + offsetY - this.coord.y > this.coord.height) {
       var top = this.ui.body.scrollTop + itemTop - this.coord.height - this.coord.y + this.options.item.height + offsetY
       this.ui.body.scrollTo({
-        top: top,
+        top,
         left: 0
         // behavior: 'smooth'
       })
@@ -142,7 +142,7 @@ export default {
       // console.lof('scrollTo', top, item)
       this.ui.body.scrollTo({
         left: 0,
-        top: top
+        top
         // behavior: 'smooth'
       })
     }
@@ -150,9 +150,9 @@ export default {
 
   selectNext (silent) {
     // console.log('selectNext', this.id)
-    var idx = this.dataList.indexOf(this.id)
+    const idx = this.dataList.indexOf(this.id)
 
-    var id = this.dataList[idx + 1]
+    const id = this.dataList[idx + 1]
 
     // console.log('id', id)
 
@@ -172,9 +172,9 @@ export default {
 
   selectPrevious (silent) {
     // console.log('selectPrevious', this.id)
-    var idx = this.dataList.indexOf(this.id)
+    const idx = this.dataList.indexOf(this.id)
 
-    var id = this.dataList[idx - 1]
+    const id = this.dataList[idx - 1]
 
     if (id) {
       this.id = id

package/src/list/status.js

@@ -9,7 +9,7 @@ export default {
 
   statusCount (count) {
     // console.log('statusCount', count)
-    var items = 'items'
+    let items = 'items'
     if (this.status && this.status.count && this.status.count.name) {
       items = this.status.count.name
     }

package/src/list/update.js

@@ -9,8 +9,8 @@ export default {
 
   getUpdatedIndex (id) {
     // console.log('getUpdatedIndex', id)
-    var index = null
-    for (var i = 0; i < this.data.length; i++) {
+    let index = null
+    for (let i = 0; i < this.data.length; i++) {
       // console.log('--', this.data[i][this.dataId], id)
       if (this.data[i][this.dataId] === id) {
         index = i
@@ -23,9 +23,9 @@ export default {
 
   getUpdatedInfo (id) {
     // console.log('getUpdatedInfo', id)
-    var index = this.getUpdatedIndex(id)
+    const index = this.getUpdatedIndex(id)
     // console.log('index', index)
-    var route = this.buildRoute(index + 1, 1)
+    const route = this.buildRoute(index + 1, 1)
     // console.log('roote', route)
     fetch(route).then((resp) => {
       return resp.json()
@@ -50,10 +50,10 @@ export default {
     this.dataStore[info[this.dataId]] = info
 
     // update item if on the screen
-    var item = this.ui.body.querySelector('[data-id="' + info[this.dataId] + '"]')
+    const item = this.ui.body.querySelector('[data-id="' + info[this.dataId] + '"]')
     if (item) {
       item.innerHTML = ''
-      var layout = new Layout(this.options.layout.item, item)
+      const layout = new Layout(this.options.layout.item, item)
 
       this.renderInfo(layout, info)
     }

package/src/list/virtual.js

@@ -39,14 +39,14 @@ function VirtualList (options) {
 VirtualList.prototype._renderChunk = function (node, from, number) {
   // console.log('_renderChunk', from, number, this.options.class)
 
-  var fragment = document.createDocumentFragment()
+  const fragment = document.createDocumentFragment()
   fragment.appendChild(this.scroller)
 
-  var last = from + number
+  let last = from + number
   if (last > this.count) last = this.count
 
-  for (var i = from; i < last; i++) {
-    var item = this.render(i)
+  for (let i = from; i < last; i++) {
+    const item = this.render(i)
 
     item.style.position = 'absolute'
     item.style.top = i * this.itemHeight + 'px'
@@ -84,7 +84,7 @@ VirtualList.prototype.set = function (items) {
   this.container.innerHTML = ''
   this.container.scrollTop = 0
 
-  var height = this.itemHeight * this.count
+  const height = this.itemHeight * this.count
 
   this.scroller.style.height = height + 'px'
 
@@ -94,7 +94,7 @@ VirtualList.prototype.set = function (items) {
   // console.log('this.itemsByScreen', this.itemsByScreen)
 
   // Cache 4 times the number of items that fit in the container viewport
-  var size = this.itemsByScreen * 4
+  let size = this.itemsByScreen * 4
   this._renderChunk(this.container, 0, size)
 
   this.size = size
@@ -102,13 +102,13 @@ VirtualList.prototype.set = function (items) {
   // console.log('emit size', size)
   this.emit('size', size)
 
-  var self = this
-  var lastRepaintY
-  var maxBuffer = this.itemsByScreen * this.itemHeight
+  const self = this
+  let lastRepaintY
+  const maxBuffer = this.itemsByScreen * this.itemHeight
 
   function onScroll (e) {
     // console.log('scroll', e.target.scrollTop, height)
-    var scrollTop = e.target.scrollTop
+    const scrollTop = e.target.scrollTop
 
     // console.log('itemsByScreen', self.itemsByScreen)
 
@@ -124,7 +124,7 @@ VirtualList.prototype.set = function (items) {
 
     // console.log('itemsByScreen', self.itemsByScreen)
 
-    var first = parseInt(scrollTop / self.itemHeight) - self.itemsByScreen
+    let first = parseInt(scrollTop / self.itemHeight) - self.itemsByScreen
     first = first < 0 ? 0 : first
 
     size = self.itemsByScreen * 4
@@ -134,7 +134,7 @@ VirtualList.prototype.set = function (items) {
       lastRepaintY = scrollTop
     }
 
-    var progress = Math.ceil((scrollTop / self.itemHeight) + self.itemsByScreen) - 1
+    const progress = Math.ceil((scrollTop / self.itemHeight) + self.itemsByScreen) - 1
     // console.log('progress', progress)
     self.emit('progress', progress)
 
@@ -160,14 +160,14 @@ VirtualList.prototype.update = function (items) {
   this.count = this.items.length
 
   // var itemsByScreen = Math.ceil(this.container.offsetHeight / this.itemHeight)
-  var cachedItemsLen = this.itemsByScreen * 4
-  var scrollTop = this.container.scrollTop
+  const cachedItemsLen = this.itemsByScreen * 4
+  const scrollTop = this.container.scrollTop
 
-  var height = this.itemHeight * this.count
+  const height = this.itemHeight * this.count
 
   this.scroller.style.height = height + 'px'
 
-  var first = parseInt(scrollTop / this.itemHeight) - this.itemsByScreen
+  let first = parseInt(scrollTop / this.itemHeight) - this.itemsByScreen
   first = first < 0 ? 0 : first
 
   // console.log('first', first, cachedItemsLen)
@@ -183,7 +183,7 @@ VirtualList.prototype.add = function (items) {
 
   this.count = this.items.length
 
-  var height = this.itemHeight * this.count
+  const height = this.itemHeight * this.count
 
   this.scroller.style.height = height + 'px'
 }
@@ -212,10 +212,10 @@ VirtualList.prototype.setOffset = function (info) {
 
   // console.log('new itemsByScreen', this.itemsByScreen)
 
-  var itemsByScreen = Math.ceil(this.offsetHeight / this.itemHeight)
+  const itemsByScreen = Math.ceil(this.offsetHeight / this.itemHeight)
 
   // Cache 4 times the number of items that fit in the container viewport
-  var size = itemsByScreen * 4
+  const size = itemsByScreen * 4
 
   return size
 }
@@ -227,7 +227,7 @@ VirtualList.prototype.getCount = function () {
 }
 
 VirtualList.createScroller = function () {
-  var scroller = document.createElement('div')
+  const scroller = document.createElement('div')
   scroller.classList.add('scroller')
   return scroller
 }

package/src/list/virtual.new.js

@@ -1,15 +1,15 @@
 // based on https://sergimansilla.com/blog/virtual-scrolling/
 
 // Import necessary modules
-import passiveEvents from '../module/passive'  // Import the passiveEvents utility.
-import emitter from '../module/emitter'        // Import the emitter module.
+import passiveEvents from '../module/passive' // Import the passiveEvents utility.
+import emitter from '../module/emitter' // Import the emitter module.
 
 // Define the VirtualList class
 class VirtualList {
   constructor (options) {
     // Initialize the class with options passed to the constructor.
-    this.options = { ...(options || {}) }  // Spread operator to merge options with default values.
-    Object.assign(this, emitter)           // Assign emitter methods to the instance.
+    this.options = { ...(options || {}) } // Spread operator to merge options with default values.
+    Object.assign(this, emitter) // Assign emitter methods to the instance.
 
     // Destructure options for easier access to properties.
     const { itemHeight = 0, size = 0, items = [], render, container } = options
@@ -103,7 +103,7 @@ class VirtualList {
     // Add a scroll event listener to render items dynamically.
     const onScroll = (e) => {
       const scrollTop = e.target.scrollTop
-      let first = parseInt(scrollTop / this.itemHeight) - this.itemsByScreen
+      const first = parseInt(scrollTop / this.itemHeight) - this.itemsByScreen
 
       size = this.itemsByScreen * 4