material 0.7.1 → 0.7.4

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
 

package/src/list.js

@@ -1,4 +1,4 @@
-import addClass from './module/addclass'
+import * as css from './module/css'
 
 const defaults = {
   className: 'text',
@@ -10,19 +10,17 @@ class List {
   constructor (options) {
     this.options = Object.assign({}, defaults, options || {})
 
-    // console.log('options', this.options)
-
     this.build()
 
     return this
   }
 
   build () {
-    this.root = document.createElement(this.options.tag)
-    addClass(this.root, this.options.class)
+    this.element = document.createElement(this.options.tag)
+    css.add(this.element, this.options.class)
 
     if (this.options.class !== 'text') {
-      this.root.classList.add('text')
+      this.element.classList.add('text')
     }
 
     if (this.options.list) {
@@ -30,7 +28,7 @@ class List {
     }
 
     if (this.options.container) {
-      this.options.container.appendChild(this.root)
+      this.options.container.appendChild(this.element)
     }
 
     return this
@@ -52,16 +50,16 @@ class List {
 
     var label = this.options.label || ''
 
-    this.root.innerHTML = label + text
+    this.element.innerHTML = label + text
 
     if (this.options.spaceAfter) {
-      this.root.innerHTML = this.root.innerHTML + ' '
+      this.element.innerHTML = this.element.innerHTML + ' '
     }
   }
 
   setText (text) {
     // console.log('setText', text)
-    this.root.innerHTML = text
+    this.element.innerHTML = text
   }
 }
 

package/src/map/build.js

@@ -1,4 +1,4 @@
-import observer from '../module/observer'
+import observer from '../module/element/observer'
 import Islands from '../view/islands'
 import preventPullRefresh from '../module/preventPullRefresh'
 import touch from '../module/touchscreen'
@@ -51,7 +51,7 @@ export default {
 
       //   })
       // } else {
-        // console.log('panzoom')
+      // console.log('panzoom')
       this.draggable = new PanZoom(this.slide, {
         maxZoom: 16,
         minZoom: 1

package/src/map/countries.js

@@ -7,10 +7,10 @@ export default {
    */
   updateCountries (isocodes) {
     // console.log('updateCountries', isocodes.length)
-    var list = document.querySelectorAll('svg.mapsvg g')
+    const list = document.querySelectorAll('svg.mapsvg g')
     // console.log('svg', list)
 
-    for (var i = 0; i < list.length; i++) {
+    for (let i = 0; i < list.length; i++) {
       if (isocodes.indexOf(list[i].dataset.isocode) > -1) {
         list[i].classList.remove('empty')
       } else {
@@ -31,7 +31,7 @@ export default {
    */
   random (isocodes) {
     // console.log('random', isocodes.length)
-    let i = Math.floor(Math.random() * isocodes.length)
+    const i = Math.floor(Math.random() * isocodes.length)
     this.isocodes = isocodes[i]
     this.highlight(this.isocodes)
 
@@ -42,10 +42,10 @@ export default {
    * [setAllCountries description]
    */
   setAllCountries () {
-    var list = document.querySelectorAll('svg.mapsvg g')
+    const list = document.querySelectorAll('svg.mapsvg g')
     // console.log('svg', list)
 
-    for (var i = 0; i < list.length; i++) {
+    for (let i = 0; i < list.length; i++) {
       list[i].classList.remove('empty')
     }
   },
@@ -64,7 +64,7 @@ export default {
     if (typeof isocodes === 'string') {
       this.highlightCountry(isocodes, option)
     } else {
-      for (var i = 0; i < isocodes.length; i++) {
+      for (let i = 0; i < isocodes.length; i++) {
         this.highlightCountry(isocodes[i], option)
       }
     }
@@ -78,7 +78,7 @@ export default {
    */
   highlightCountry (isocode, option) {
     // console.log('highlightCountry', isocode, option)
-    var group = this.map.querySelector('[data-isocode="' + isocode + '"]')
+    const group = this.map.querySelector('[data-isocode="' + isocode + '"]')
 
     if (!group) return
 
@@ -108,7 +108,7 @@ export default {
   },
 
   removePlaying () {
-    var group = document.querySelector('svg.mapsvg g.playing')
+    const group = document.querySelector('svg.mapsvg g.playing')
     group.classList.remove('playing')
   }
 }

package/src/map/display.js

@@ -5,7 +5,7 @@ export default {
     // object used to cache map by decade
     this.mapsvg = this.mapsvg || {}
 
-    var decade = decades[0]
+    const decade = decades[0]
 
     // do not update map when in taxi mode
     // if (typeof decade !== 'number') {
@@ -20,7 +20,7 @@ export default {
       if (cb) cb()
     } else {
       // fetch map for the corresponding decade
-      var url = this.options.path + decade + '.svg'
+      const url = this.options.path + decade + '.svg'
       // console.log(url)
       fetch(url).then((response) => {
         response.text().then((map) => {
@@ -52,12 +52,12 @@ export default {
 
   optimizeMap (decade) {
     // console.log('optimizing map', decade)
-    var parts = this.map.querySelectorAll('g[data-isocode]')
-    var country = {}
+    const parts = this.map.querySelectorAll('g[data-isocode]')
+    const country = {}
 
-    for (var i = 0; i < parts.length; i++) {
-      var part = parts[i]
-      var code = part.dataset.isocode
+    for (let i = 0; i < parts.length; i++) {
+      const part = parts[i]
+      const code = part.dataset.isocode
       if (!country[code]) {
         country[code] = part
       } else {
@@ -98,7 +98,7 @@ export default {
   },
 
   updateMap () {
-    var offsetX = this.element.offsetWidth - this.map.offsetWidth
+    const offsetX = this.element.offsetWidth - this.map.offsetWidth
     // var offsetY = this.element.height - this.map.offsetHeight
 
     // console.log('--', this.offsetX / 2 + 'px')
@@ -114,17 +114,17 @@ export default {
 
   screenSize () {
     // console.log('screensize')
-    var width = window.innerWidth ||
+    const width = window.innerWidth ||
     document.documentElement.clientWidth ||
     document.body.clientWidth
 
-    var height = window.innerHeight ||
+    const height = window.innerHeight ||
     document.documentElement.clientHeight ||
     document.body.clientHeight
 
-    var screen = {
-      width: width,
-      height: height
+    const screen = {
+      width,
+      height
     }
 
     this.screen = screen

package/src/map/focus.js

@@ -6,7 +6,7 @@ export default {
    */
   focus (country) {
     // console.log('focus', country)
-    var part = this.getCountryParts(country)
+    const part = this.getCountryParts(country)
     // console.log('focus on part', part)
     this.draggable.focus(part)
 
@@ -15,18 +15,18 @@ export default {
 
   getCountryParts (country) {
     // console.log('focus', country)
-    var parts = this.map.querySelectorAll('[data-isocode="' + country + '"]')
+    const parts = this.map.querySelectorAll('[data-isocode="' + country + '"]')
     // console.log('parts', parts)
 
     return this.getBiggestPart(parts)
   },
 
   getBiggestPart (parts) {
-    var surface = 0
-    var biggest = null
-    for (var i = 0; i < parts.length; i++) {
-      var part = parts[i]
-      var rect = part.getBoundingClientRect()
+    let surface = 0
+    let biggest = null
+    for (let i = 0; i < parts.length; i++) {
+      const part = parts[i]
+      const rect = part.getBoundingClientRect()
 
       if (rect.width * rect.height > surface) {
         surface = rect.width * rect.height

package/src/map/select.js

@@ -17,7 +17,7 @@ export default {
       this.isocodes = [isocode]
     } else {
       this.isocodes = this.isocodes || []
-      var index = this.isocodes.indexOf(isocode)
+      const index = this.isocodes.indexOf(isocode)
       if (index > -1) {
         this.isocodes.splice(index, 1)
         this.highlight(isocode, false)
@@ -54,7 +54,7 @@ export default {
 
     // console.log('islands list', this.islands.list, island.dataset.id)
 
-    var info = this.islands.list[island.dataset.id]
+    const info = this.islands.list[island.dataset.id]
 
     this.emit('island', info)
   },

package/src/map/set.js

@@ -54,9 +54,9 @@ export default {
 
   setIsocodes (isocodes) {
     this.isocodes = this.isocodes || []
-    var l = this.isocodes.length
-    for (var i = 0; i < l; i++) {
-      var isocode = this.isocodes.splice(0, 1)
+    const l = this.isocodes.length
+    for (let i = 0; i < l; i++) {
+      const isocode = this.isocodes.splice(0, 1)
       this.highlight(isocode, false)
     }
 

package/src/map/viewport.js

@@ -3,21 +3,21 @@ export default {
   updatePaths () {
     this.path = {}
     this.paths = []
-    var paths = this.paths = this.map.querySelectorAll('path')
+    const paths = this.paths = this.map.querySelectorAll('path')
     this.path = this.path || {}
 
-    for (var i = 0; i < paths.length; i++) {
-      var path = paths[i]
-      var rect = path.getBoundingClientRect()
+    for (let i = 0; i < paths.length; i++) {
+      const path = paths[i]
+      const rect = path.getBoundingClientRect()
       this.path[i] = rect
     }
   },
 
   updateViewport () {
     console.log('updateViewport', this.rect, this.screen)
-    var paths = this.paths
-    for (var i = 0; i < paths.length; i++) {
-      var path = paths[i]
+    const paths = this.paths
+    for (let i = 0; i < paths.length; i++) {
+      const path = paths[i]
       if (this.viewport(this.path[i])) {
         path.classList.remove('hide')
       } else {
@@ -31,10 +31,10 @@ export default {
 
     // *var rect = this.path[path]
 
-    var top = rect.top
-    var left = rect.left
-    var width = rect.width
-    var height = rect.height
+    const top = rect.top
+    const left = rect.left
+    const width = rect.width
+    const height = rect.height
 
     return (
       top >= this.screen.y &&

package/src/menu.js

@@ -20,26 +20,26 @@ class Menu extends EventEmitter {
     events: [
       ['element.click', 'close']
     ]
-  };
+  }
 
   constructor (options) {
     super()
-    
+
     this.init(options)
-    this.build(this.constructor)    
+    this.build(this.constructor)
     this.bindEvents()
 
     this.render(this.options.items)
   }
 
-  init(options) {
+  init (options) {
     this.options = Object.assign({}, Menu.defaults, options || {})
     Object.assign(this, build, bindEvents, display)
   }
 
   render (items) {
-      if (items && Array.isArray(items)) {
-      for (var i = 0; i < items.length; i++) {
+    if (items && Array.isArray(items)) {
+      for (let i = 0; i < items.length; i++) {
         this.add(items[i])
       }
     }
@@ -48,8 +48,8 @@ class Menu extends EventEmitter {
   }
 
   add (obj) {
-    if (typeof obj !== 'object') return this;
-    let item;
+    if (typeof obj !== 'object') return this
+    let item
     if (obj.type === 'divider') {
       item = new Element({ tag: 'li', class: 'divider' })
     } else {
@@ -64,11 +64,11 @@ class Menu extends EventEmitter {
     return this
   }
 
-  position(target) {
+  position (target) {
     if (!target) return
-    var offs = target.getBoundingClientRect()
+    const offs = target.getBoundingClientRect()
 
-    var offsw = this.offset = this.ui.surface.getBoundingClientRect()
+    const offsw = this.offset = this.ui.surface.getBoundingClientRect()
 
     this.ui.surface.style.top = (offs.top - 4) + 'px'
     this.ui.surface.style.left = offs.left - offsw.width + offs.width + 'px'
@@ -76,7 +76,7 @@ class Menu extends EventEmitter {
     return this
   }
 
-  close() {
+  close () {
     // console.log('close')
     this.destroy()
   }

package/src/mixin/control.js

@@ -1,5 +1,5 @@
 import create from '../element/create'
-import css from '../module/css'
+import * as css from '../module/css'
 import insert from '../element/insert'
 
 const KEYCODE = {
@@ -7,7 +7,7 @@ const KEYCODE = {
   SPACE: 32
 }
 
-var control = {
+const control = {
   /**
    * [toggle description]
    * @return {Object} The class instance
@@ -96,7 +96,7 @@ var control = {
     error = error || this.options.error
     if (this.options.error === null) return
 
-    let text = this.options.error || this.options.text
+    const text = this.options.error || this.options.text
 
     if (!this.element.error) { this.element.error = create('error', this.options.class + '-error') }
 

package/src/mixin/controller.js

@@ -110,7 +110,7 @@ class Controller {
       return false
     }
 
-    for (var i = 0, len = this._topics[topic].length; i < len; i++) {
+    for (let i = 0, len = this._topics[topic].length; i < len; i++) {
       if (this._topics[topic][i] === callback) {
         this._topics[topic].splice(i, 1)
         return true
@@ -127,20 +127,20 @@ class Controller {
   publish () {
     this._topics = this._topics || {}
 
-    var args = Array.prototype.slice.call(arguments)
-    var topic = args.shift()
+    const args = Array.prototype.slice.call(arguments)
+    const topic = args.shift()
     // _log.debug('publish', topic);
     if (!this._topics.hasOwnProperty(topic)) {
       return false
     }
 
-    for (var i = 0, len = this._topics[topic].length; i < len; i++) {
+    for (let i = 0, len = this._topics[topic].length; i < len; i++) {
       this._topics[topic][i].apply(undefined, args)
     }
     return true
   }
 }
 
-var controller = new Controller()
+const controller = new Controller()
 
 export default controller

package/src/mixin/create.js

@@ -1,7 +1,7 @@
 import classify from '../module/classify'
 
 function create (options) {
-  var element = document.createElement(options.tag || 'div')
+  const element = document.createElement(options.tag || 'div')
 
   classify(element, options)
 

package/src/mixin/display.js

@@ -70,6 +70,6 @@ export default {
       dom.destroy(this.element)
     }
 
-   this.emit?.('destroy')
+    this.emit?.('destroy')
   }
 }

package/src/mixin/events.js

@@ -1,16 +1,10 @@
 export default {
-
-  /**
-   * cross browser addEvent
-   * @param {string}   event The event to add
-   * @param {Function} fn    [description]
-   */
   addEvent (event, fn) {
-    var element = this.element
+    const element = this.element
     // avoid memory overhead of new anonymous functions for every event handler that's installed
     // by using local functions
     function listenHandler (e) {
-      var ret = fn.apply(this, arguments)
+      const ret = fn.apply(this, arguments)
       if (ret === false) {
         e.stopPropagation()
         e.preventDefault()
@@ -21,7 +15,7 @@ export default {
     function attachHandler () {
       // set the this pointer same as addEventListener when fn is called
       // and make sure the event is passed to the fn also so that works the same too
-      var ret = fn.call(element, window.event)
+      const ret = fn.call(element, window.event)
       if (ret === false) {
         window.event.returnValue = false
         window.event.cancelBubble = true
@@ -38,14 +32,8 @@ export default {
     return this
   },
 
-  /**
-   * cross browser removeEvent
-   * @param  {string}   event The event to remove
-   * @param  {Function} fn    [description]
-   * @return {Object}         [description]
-   */
   removeEvent (event, fn) {
-    var element = this.element
+    const element = this.element
 
     if (element.removeEventListener) {
       element.removeEventListener(event, fn, false)

package/src/mixin/focus.js

@@ -1,4 +1,4 @@
-import css from '../module/css'
+import * as css from '../module/css'
 
 export default {
   /**

package/src/mixin/icon.js

@@ -11,12 +11,12 @@ function icon (root, svg, options) {
     return
   }
 
-  var position = 'top'
+  let position = 'top'
   if (options && options.type === 'text-icon') {
     position = 'bottom'
   }
 
-  var element = create('i', options.class + '-icon')
+  const element = create('i', options.class + '-icon')
   insert(element, root, position)
 
   element.innerHTML = svg