material 0.7.1 → 0.7.4

package/src/layout.js

@@ -1,5 +1,5 @@
 import { is as isObject } from './module/object'
-import css from './module/css'
+import * as css from './module/css'
 
 class Layout {
   constructor (schema, container) {
@@ -16,10 +16,10 @@ class Layout {
     structure = structure || {}
     let component = null
 
-    for (var i = 0; i < schema.length; i++) {
+    for (let i = 0; i < schema.length; i++) {
       // console.log('index', i, typeof schema[i])
       var name
-      var options = {}
+      let options = {}
 
       if (schema[i] instanceof Object &&
         typeof schema[i] === 'function') {
@@ -37,7 +37,7 @@ class Layout {
         }
 
         component = new schema[i](options)
-        var element = component.element || component
+        const element = component.element || component
 
         if (level === 1) {
           structure.element = element
@@ -49,7 +49,7 @@ class Layout {
         }
 
         // if (component) {
-        //   this.display(component.root, options)
+        //   this.display(component.element, options)
         //   this.style(component, options)
         // }
 
@@ -57,7 +57,7 @@ class Layout {
           if (component.insert) {
             component.insert(container)
           } else {
-            var wrapper = container.element || container
+            const wrapper = container.element || container
 
             wrapper.appendChild(element)
 
@@ -68,7 +68,7 @@ class Layout {
           component._container = container
         }
       } else if (Array.isArray(schema[i])) {
-       // console.log('------', schema[i])
+        // console.log('------', schema[i])
         if (component == null) {
           component = container
         }
@@ -80,8 +80,8 @@ class Layout {
   }
 
   display (element, options) {
-    var display = options.display
-    var direction = options.direction || 'horizontal'
+    const display = options.display
+    const direction = options.direction || 'horizontal'
 
     if (!element || !display) return
 
@@ -93,14 +93,14 @@ class Layout {
   }
 
   style (component) {
-    var options = component.options || {}
+    const options = component.options || {}
 
     // console.log('component', component);
 
     if (options.flex) {
       css.add(component.element, 'flex-' + options.flex)
     } else {
-      var size = options.size
+      const size = options.size
       if (options.size && options.width) {
         component.element.width = size + 'px'
       } else if (options.size && options.height) {
@@ -128,11 +128,11 @@ class Layout {
   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) {
           // console.log('field', infos[0], infos[1])

package/src/link.js

@@ -13,7 +13,7 @@ class Link {
   }
 
   init (options) {
-    this.options = Object.assign({}, Link.defaults, options || {})
+    this.options = { ...Link.defaults, ...options }
     Object.assign(this, build)
   }
 

package/src/list/build.js

@@ -40,12 +40,12 @@ export default {
       this.options.container.appendChild(this.element)
     }
 
-    var scrollbarOffset = scrollbar()
+    const scrollbarOffset = scrollbar()
 
     // console.log('scrollbarOffset', scrollbarOffset)
     if (this.ui && this.ui.body) {
       // console.log('body padding', 11 - scrollbarOffset + 'px')
-      this.ui.body.style['marginRight'] = 11 - scrollbarOffset + 'px'
+      this.ui.body.style.marginRight = 11 - scrollbarOffset + 'px'
       this.ui.body.classList.add('offset' + scrollbarOffset)
     }
 
@@ -53,16 +53,16 @@ export default {
   },
 
   addClass (c) {
-    var list = c.split(' ')
+    const list = c.split(' ')
 
-    for (var i = 0; i < list.length; i++) {
+    for (let i = 0; i < list.length; i++) {
       this.element.classList.add(list[i])
     }
   },
 
   buildVirtual () {
     // console.log('buildVirtual', this.options.class)
-    var height = 80
+    let height = 80
     this.size = this.options.list.size
     this.stop = false
 
@@ -100,15 +100,15 @@ export default {
       // console.log('progress', progress, this.count)
 
       if (this.statusDisplay) {
-        var percent = parseInt(progress / this.count * 100)
+        const percent = parseInt(progress / this.count * 100)
         this.statusDisplay('count', percent + '% | ' + progress + ' / ' + this.count)
       }
 
       this.onProgress(progress)
     })
     // .on('size', (size) => {
-      // console.log('!!!!size', size)
-      // this.size = size
+    // console.log('!!!!size', size)
+    // this.size = size
     // })
     //
   },

package/src/list/click.js

@@ -8,9 +8,9 @@ export default {
       return
     }
 
-    var target = '[data-id]'
-    var item = e.target
-    var i = 0
+    const target = '[data-id]'
+    let item = e.target
+    let i = 0
 
     while (item && !item.matches(target)) {
       // console.log('item', item)

package/src/list/filter.js

@@ -3,7 +3,7 @@ export default {
   initFilter () {
     this.filter = this.extractFilter(this.ui)
 
-    for (var name in this.filter) {
+    for (const name in this.filter) {
       if (this.filter.hasOwnProperty(name)) {
         this.filter[name].on('change', () => {
           this.request()
@@ -15,15 +15,15 @@ export default {
       this.clearFilter()
     })
 
-    this.ui['filter'].on('click', () => {
+    this.ui.filter.on('click', () => {
       this.toggleFilter()
     })
   },
 
   getFilter () {
     console.log('getFilter')
-    var filter = null
-    for (var name in this.filter) {
+    let filter = null
+    for (const name in this.filter) {
       if (this.filter.hasOwnProperty(name)) {
         console.log('--', typeof this.filter[name].get(), this.filter[name].get())
         if (this.filter[name].get() !== ''/* && this.filter[name].get() !== [] */) {
@@ -61,7 +61,7 @@ export default {
     }
 
     // console.log('showSearch')
-    this.ui['filter'].element.classList.add('selected')
+    this.ui.filter.element.classList.add('selected')
     this.ui['filter-input'].classList.add('show')
 
     // this.ui['search-list'].classList.add('show')
@@ -74,7 +74,7 @@ export default {
    */
   hideFilter () {
     // console.log('hideSearch')
-    this.ui['filter'].element.classList.remove('selected')
+    this.ui.filter.element.classList.remove('selected')
     this.ui['filter-input'].classList.remove('show')
     // this.ui['search-list'].classList.remove('show')
     // this.ui.body.classList.remove('hide')
@@ -83,7 +83,7 @@ export default {
   },
 
   clearFilter () {
-    for (var name in this.filter) {
+    for (const name in this.filter) {
       if (this.filter.hasOwnProperty(name)) {
         this.filter[name].set('')
       }
@@ -95,14 +95,14 @@ export default {
   extractFilter (object) {
     // console.log('extractField', object)
 
-    var filter = {}
+    const filter = {}
 
-    for (var property in object) {
+    for (const property in object) {
       if (object.hasOwnProperty(property)) {
-        var str = property.split(/\./)
+        const str = property.split(/\./)
 
         if (str[0] === 'filter' && str[1] !== undefined) {
-          var name = property.substr(7, property.length)
+          const name = property.substr(7, property.length)
 
           filter[name] = object[property]
         }

package/src/list/image.js

@@ -1,17 +1,17 @@
 export default {
   image (info, layout) {
     if (info.image) {
-      var format = 'thumb'
+      let format = 'thumb'
       if (this.options.image && this.options.image.format) {
         format = this.options.image.format || format + '/'
       } else {
         format = ''
       }
 
-      var r = Math.floor(Math.random() * 100000) + 1
+      const r = Math.floor(Math.random() * 100000) + 1
 
       if (info.image.filename) {
-        var image = info.image.url + format + info.image.filename
+        const image = info.image.url + format + info.image.filename
         layout.get('image').style.backgroundImage = 'url("' + image + '?' + r + '")'
       }
     }

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]
@@ -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)
@@ -118,9 +118,9 @@ export default {
     }
 
     if (this.ui['search-input']) {
-      this.ui['search-input'].input.value = ''
-      this.ui['search-input'].element.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 = ''
@@ -142,8 +142,8 @@ export default {
       this.ui.search.element.classList.remove('selected')
     }
     if (this.ui['search-input']) {
-      this.ui['search-input'].element.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)
     }