material 0.9.20 → 0.9.21

package/src/list.new/request.js

@@ -1,216 +0,0 @@
-export default {
-  requestById (id, cb) {
-    // log.error('requestById', id)
-    if (!id) return
-    return this.getPage(id, (data) => {
-      // log.error('getPage', data)
-      const page = data?.page || null
-      if (data?.count) this.virtual.setCount(data?.count)
-      this.request(page, null, null, cb)
-    })
-  },
-
-  request (page, size, more, cb) {
-    // console.log('request', page, size, more, cb)
-    if (more !== true) {
-      this.ui.body.innerHTML = ''
-      this.virtual.reset()
-      this.dataList = []
-      this.data = []
-      this.page = 1
-      this.stop = true
-    } else {
-      if (this.dataList.length < size) {
-        // console.log('no more request needed, data ', this.dataList.length)
-        return
-      }
-    }
-
-    this.data = this.data || []
-    let signal = null
-
-    if (this.abortController) {
-      // console.log('abort')
-      this.abortController.abort()
-      this.abortController = null
-    }
-
-    if (more !== true && window.AbortController) {
-      this.abortController = new AbortController()
-      signal = this.abortController.signal
-    }
-
-    page = page || 1
-    size = size || this.options.list.size
-    // console.log('size', this.options.name, size)
-
-    if (page === 1) {
-      this.ui.body.scrolltop = 0
-    }
-
-    const route = this.buildRoute(page, size)
-
-    if (more !== true && this.options.count) {
-      this.requestCount(route)
-    }
-
-    // console.log('route - ', this.rand, route)
-
-    fetch(route, { signal }).then((resp) => {
-      return resp.json()
-    }).then((data) => {
-      if (this.options.debug) {
-        console.log('data', route, data.length, data)
-      }
-
-      // console.log('route', route);
-
-      data = data || []
-
-      if (this.options.reverse) {
-        data.reverse()
-      }
-
-      if (data.error) {
-        console.log('error', data.error)
-        return
-      }
-
-      if (data.length < this.size && more) {
-        this.stop = true
-      } else {
-        this.stop = false
-      }
-
-      this.data = []
-      this.data = data
-      this.storeData(data, page, size)
-      this.render(data, page, size)
-
-      // if (more === true) {
-      //   const a = this.data.concat(data)
-      //   this.data = a
-      //   this.storeData(data, more)
-      //   this.virtual.add(this.data, { page, size })
-      // } else {
-      //   this.data = []
-      //   this.data = data
-      //   this.storeData(data)
-      //   this.render(data, page, size)
-      // }
-
-      if (cb) cb()
-
-      this.emit('fetched', data)
-
-      this.loaded = true
-
-      if (page === 1 && data.length < 1) {
-        this.emit('empty')
-      }
-    }).catch(function (e) {
-      // console.log('error', e.message)
-    })
-  },
-
-  getPage (id, cb) {
-    // log.info('getPage', id)
-    if (!id) {
-      return Promise.reject(new Error('id is required'))
-    }
-
-    const route = this.buildRoute(null, null, null, id)
-
-    // log.error('route', route)
-
-    return fetch(route)
-      .then((resp) => resp.json())
-      .then((data) => {
-        // log.debug('getPage data', data)
-        if (cb) cb(data)
-        return data
-      })
-      .catch((e) => {
-        // console.log('error', e.message)
-        return Promise.reject(e)
-      })
-  },
-
-  requestCount (route, signal) {
-    log.error('fetchCount', route + '&count=1')
-    fetch(route + '&count=1', { signal }).then((resp) => {
-      return resp.json()
-    }).then((data) => {
-      log.info('data', data.count)
-      this.count = data.count
-      this.statusDisplay('count', data.count)
-      log.info(this.virtual.setCount)
-      this.virtual.setCount(data.count)
-    }).catch(function (e) {
-      // console.log('error', e.message)
-    })
-  },
-
-  addParams (route, params) {
-    // log.info('addParams', route, params)
-
-    if (!route) {
-      console.log('error: no route specified!')
-
-      return
-    }
-
-    if (route.indexOf('?') > -1) {
-      // console.log('?', route, route.length, route[route.length - 1])
-      if (route[route.length - 1] === '&' || route[route.length - 1] === '?') {
-        route = route + params
-      } else {
-        route = route + '&' + params
-      }
-    } else {
-      // console.log('add ?')
-      route = route + '?' + params
-    }
-
-    return route
-  },
-
-  buildRoute (page, size, path, id) {
-    // log.info('buildroute', this.options.route, path)
-    path = path || 'list'
-
-    page = page || 1
-    size = size || this.options.list.size
-
-    let route = this.options.route
-
-    if (path) {
-      route = this.options.route[path]
-    }
-
-    if (this.routeAddOn) {
-      route = this.routeAddOn(route, path, id)
-    }
-
-    if (this.params && this.params()) {
-      // console.log('params', route, this.params())
-      route = this.addParams(route, this.params())
-    } else {
-
-    }
-
-    if (this.ui.filter && this.ui.filter.element.classList.contains('selected')) {
-      route = this.addParams(route, this.getFilter())
-    }
-
-    if (this.options.pagination) {
-      if (id) {
-        route = this.addParams(route, 'id=' + id + '&size=' + size)
-      } else {
-        route = this.addParams(route, 'page=' + page + '&size=' + size)
-      }
-    }
-
-    return route
-  }
-}

package/src/list.new/search.js

@@ -1,155 +0,0 @@
-export default {
-  search (keywords, page, size, more) {
-    // console.log('search', keywords, page, size, more)
-
-    this.emit('searching')
-
-    if (more !== true) {
-      this.ui.body.innerHTML = ''
-      this.virtual.reset()
-      this.data = []
-      this.dataList = []
-      this.data = []
-      this.page = 1
-      this.stop = false
-    }
-
-    this.data = this.data || []
-    let signal = null
-
-    if (this.abortController) {
-      this.abortController.abort()
-      this.abortController = null
-    }
-
-    if (more !== true) {
-      this.abortController = new AbortController()
-      signal = this.abortController.signal
-    }
-
-    page = page || 1
-    size = size || this.options.list.size
-
-    if (page === 1) {
-      this.ui.body.scrolltop = 0
-    }
-
-    let route = this.buildRoute(page, size, 'search')
-
-    route = this.addParams(route, 'search=' + keywords)
-
-    // console.log('route', route)
-
-    if (more !== true && this.options.count) {
-      this.requestCount(route)
-    }
-
-    fetch(route, { signal }).then((resp) => {
-      return resp.json()
-    }).then((data) => {
-      // console.log('data', data)
-      this.storeData(data)
-
-      this.data = data || []
-
-      // console.log('list', list)
-
-      if (data.error) {
-        console.log('error', data.error)
-        return
-      }
-
-      if (data.length < this.size && more) {
-        this.stop = true
-      }
-
-      if (more === true) {
-        const a = this.data.concat(data)
-        this.data = a
-        this.storeData(data, more)
-        this.virtual.add(this.data)
-      } else {
-        this.data = []
-        this.data = data
-        this.storeData(data)
-        this.render(data)
-      }
-
-      this.emit('fetched', data)
-    }).catch(function (e) {
-      // console.log('error', e.message)
-    })
-  },
-
-  cancelSearch () {
-    // console.log('cancel search')
-    this.ui.body.innerHTML = ''
-  },
-
-  /**
-   * [toggleSearch description]
-   * @return {[type]} [description]
-   */
-  toggleSearch (e) {
-    e.stopPropagation()
-    // console.log('toggle search', this.ui.body)
-    if (!this.ui['search-input'].element.classList.contains('show')) {
-      this.showSearch()
-    } else {
-      this.hideSearch()
-    }
-  },
-
-  /**
-   * [showSearch description]
-   * @return {[type]} [description]
-   */
-  showSearch (doNotEmpty) {
-    if (this.hideFilter) {
-      this.hideFilter()
-    }
-
-    // console.log('showSearch')
-    this.mode = 'search'
-    this.element.classList.add('search-mode')
-
-    if (this.ui.search) {
-      this.ui.search.element.classList.add('selected')
-    }
-
-    if (this.ui['search-input']) {
-      this.ui['search-input'].set()
-      this.ui['search-input'].show()
-      this.ui['search-input'].focus()
-    }
-
-    if (!doNotEmpty) this.ui.body.innerHTML = ''
-
-    // this.ui['search-list'].classList.add('show')
-    // this.ui.body.classList.add('hide')
-  },
-
-  /**
-   * [hideSearch description]
-   * @return {[type]} [description]
-   */
-  hideSearch (notfetch) {
-    // console.log('hideSearch', notfetch)
-    this.mode = 'standard'
-    this.element.classList.remove('search-mode')
-
-    if (this.ui.search) {
-      this.ui.search.element.classList.remove('selected')
-    }
-    if (this.ui['search-input']) {
-      this.ui['search-input'].hide()
-      this.ui['search-input'].set()
-    }
-    // this.ui['search-list'].classList.remove('show')
-    // this.ui.body.classList.remove('hide')
-    // console.log('request', notfetch)
-    if (!notfetch) {
-      this.request()
-    }
-  }
-}

package/src/list.new/select.js

@@ -1,221 +0,0 @@
-import clone from '../module/clone'
-
-export default {
-  select (item, silent) {
-    // console.log('select', item.dataset.id)
-    if (!item || !item.dataset.id) return
-
-    const id = item.dataset.id
-
-    this.index = this.dataList.indexOf(id)
-    this.info = this.dataStore[id]
-
-    if (this.options.preventSelectAgain && this.id === id) {
-      return
-    }
-
-    const selected = this.ui.body.querySelector('.selected')
-    if (selected) selected.classList.remove('selected')
-
-    if (id) {
-      this.highlight(item)
-      this.item = item
-      this.id = id
-
-      if (silent !== true) {
-        this.emit('select', id)
-        this.emit('selectItem', item)
-      }
-    } else {
-      this.id = null
-      this.item = null
-    }
-  },
-
-  unselect () {
-    // console.log('unselect')
-    const item = this.ui.body.querySelector('[data-id="' + this.id + '"]') || this.item
-    this.id = null
-    if (item) {
-      item.classList.remove('selected')
-    }
-    this.index = null
-    this.item = null
-  },
-
-  getInfoById (id) {
-    return clone(this.dataStore[id])
-  },
-
-  getSelectedInfo () {
-    return clone(this.dataStore[this.id])
-  },
-
-  getItemById (id, silent) {
-    // console.log('selectItemById', id)
-    const item = this.ui.body.querySelector('[data-id="' + id + '"]')
-
-    if (!item) {
-      return null
-    } else {
-      return item
-    }
-  },
-
-  selectById (id, silent) {
-    // console.log('selectById', id)
-
-    if (!this.dataList) {
-      return false
-    }
-
-    const index = this.dataList.indexOf(id)
-    if (index < 0) {
-      // console.log('can\'t selectid, not in the list')
-      return false
-    }
-
-    this.index = index
-    this.id = id
-
-    this.selectItemById(id, 'down')
-
-    return id
-  },
-
-  selectItemById (id, direction) {
-    // console.log('selectItemById', id)
-    const item = this.ui.body.querySelector('[data-id="' + id + '"]')
-
-    this.id = id
-
-    if (!item) {
-      const index = this.dataList.indexOf(id)
-      // console.log('not found in DOM, check in dataList', index)
-      if (index > -1) {
-        const listSize = this.options.list.size
-        const slice = listSize * index / listSize
-        // console.log('getSlice', slice)
-      }
-
-      return
-    }
-
-    // console.log('item found', item)
-
-    // if (this.item) this.item.classList.remove('selected')
-
-    const selected = this.ui.body.querySelector('.selected')
-    if (selected) selected.classList.remove('selected')
-
-    this.item = item
-    item.classList.add('selected')
-
-    if (this.options.updatePosition === true) {
-      // console.log('selectPosition', item)
-      this.selectPosition(item, direction)
-    }
-
-    return item
-  },
-
-  selectPosition (item, direction) {
-    const offsetY = this.options.item.height
-    direction = direction || 'down'
-    // console.log('selectPosition', this.ui.body, direction)
-
-    this.coord = this.ui.body.getBoundingClientRect()
-
-    // console.log('coord', this.coord)
-
-    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,
-        left: 0
-        // behavior: 'smooth'
-      })
-    }
-
-    if (direction === 'up' && itemTop - offsetY < this.coord.top + this.coord.y) {
-      var top = this.ui.body.scrollTop + itemTop - this.coord.top - offsetY
-      // console.lof('scrollTo', top, item)
-      this.ui.body.scrollTo({
-        left: 0,
-        top
-        // behavior: 'smooth'
-      })
-    }
-  },
-
-  selectNext (silent) {
-    // console.log('selectNext', this.id)
-    const idx = this.dataList.indexOf(this.id)
-
-    const id = this.dataList[idx + 1]
-
-    // console.log('id', id)
-
-    if (id) {
-      this.id = id
-      // console.log('item', item)
-      this.selectItemById(id, 'down')
-
-      if (silent !== true) {
-        this.emit('select', id)
-      }
-      return id
-    } else {
-      return false
-    }
-  },
-
-  selectPrevious (silent) {
-    // console.log('selectPrevious', this.id)
-    const idx = this.dataList.indexOf(this.id)
-
-    const id = this.dataList[idx - 1]
-
-    if (id) {
-      this.id = id
-      // console.log('item', item)
-      this.selectItemById(id, 'up')
-
-      if (silent !== true) {
-        this.emit('select', id)
-      }
-      return id
-    } else {
-      return false
-    }
-  },
-
-  scrollIntoView (item) {
-    // console.log('selectPrevious', this.id)
-    item = item || this.item
-
-    if (item) {
-      item.scrollIntoView({ behavior: 'instant', block: 'end', inline: 'nearest' })
-    }
-  },
-
-  highlight (item) {
-    if (this.item) {
-      this.item.classList.remove('selected')
-    }
-    item.classList.add('selected')
-  },
-
-  selectCreated (info, item) {
-    // console.log('select create', info, this.item)
-    if (this.item) {
-      this.item.classList.remove('selected')
-    }
-
-    item.classList.add('selected')
-
-    this.emit('selectCreate', info)
-  }
-}

package/src/list.new/status.js

@@ -1,21 +0,0 @@
-export default {
-
-  statusDisplay (prop, info) {
-    // console.log('status', prop, info)
-    if (prop === 'count') {
-      this.statusCount(info)
-    }
-  },
-
-  statusCount (count) {
-    // console.log('statusCount', count)
-    let items = 'items'
-    if (this.status && this.status.count && this.status.count.name) {
-      items = this.status.count.name
-    }
-
-    if (this.ui.count) {
-      this.ui.count.innerHTML = '<span class="number">' + count + '</span> ' + items
-    }
-  }
-}

package/src/list.new/update.js

@@ -1,75 +0,0 @@
-import { create } from '../module/layout'
-
-export default {
-  update (info) {
-    // console.log('update', info)
-
-    this.getUpdatedInfo(info[this.dataId])
-  },
-
-  updateInfo (info) {
-    // console.log('update', info)
-    this.dataStore[info._id] = info
-
-    // update item in the list if visible
-    const item = this.ui.body.querySelector('[data-id="' + info[this.dataId] + '"]')
-    if (item) {
-      item.innerHTML = ''
-      const layout = create(this.options.layout.item, item)
-
-      this.renderInfo(layout, info)
-    }
-  },
-
-  getUpdatedIndex (id) {
-    // console.log('getUpdatedIndex', id)
-    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
-        break
-      }
-    }
-
-    return index
-  },
-
-  getUpdatedInfo (id) {
-    // console.log('getUpdatedInfo', id)
-    const index = this.getUpdatedIndex(id)
-    // console.log('index', index)
-    const route = this.buildRoute(index + 1, 1)
-    // console.log('roote', route)
-    fetch(route).then((resp) => {
-      return resp.json()
-    }).then((data) => {
-      // console.log('info', data)
-      this.updateUpdatedInfo(data[0], index, id)
-    })
-  },
-
-  updateUpdatedInfo (info, index, id) {
-    // console.log('updateUpdatedInfo', info, index)
-
-    if (!info) return
-    if (info[this.dataId] !== id) return
-
-    this.info = info
-
-    // update datalist
-    this.data[index] = info
-
-    // update datastore
-    this.dataStore[info[this.dataId]] = info
-
-    // update item if on the screen
-    const item = this.ui.body.querySelector('[data-id="' + info[this.dataId] + '"]')
-    if (item) {
-      item.innerHTML = ''
-      const layout = create(this.options.layout.item, item)
-
-      this.renderInfo(layout, info)
-    }
-  }
-}