loader/index.js at master · compose-ui/loader · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
var classify = function(name) {
  return '.' + name.replace(/\s/g, '.')
}

var merge = function() {
  var args = [{}].concat( Array.prototype.slice.call( arguments ) )
  return Object.assign.apply( this, args )
}

var defaultSettings = {
  parent      : 'body',
  className   : 'loader',
  loading     : 'Loading…',
  success     : 'Success!',
  failure     : 'An error occurred.',
  removeAfter : 800
}

// Public API function
var Loader = {
  new: function( options ) {

    var settings = merge( defaultSettings, options || {} )

    var el

    if ( typeof settings.parent == 'string' )
        settings.parent = document.querySelector( settings.parent )

    function element () {
      if ( !el ) {
        settings.parent.insertAdjacentHTML( 'beforeend', '<div class="' + settings.className + '"></div>' );
        el = settings.parent.lastChild
      }

      return el
    }

    function show ( options ) {
      options = merge( settings, options || {} )

      el = element()

      el.textContent = options.message
      el.className   = settings.className

      el.classList.add( options.className )

      if ( options.removeAfter ) {

        // Remove loader after timeout
        setTimeout( function(){
          remove( options.callback )
        }, options.removeAfter )

      }
    }

    function loading ( options ) {
      show( setDefaults( options, 'loading' ) )
    }

    function success ( options ) {
      show( setDefaults( options, 'success' ) )
    }

    function failure ( options ) {
      show( setDefaults( options, 'failure' ) )
    }

    function setDefaults ( options, type ) {

      if ( typeof options == 'string' )
        options = { message: options }

      options = merge( {
        message: settings[ type ],
        className: type
      }, options || {} )


      // Default to removeAfter setting (not overriding false)
      if ( typeof options.removeAfter == 'undefined' ) {
        if ( type == 'loading' )
          options.removeAfter = false
        else
          options.removeAfter = settings.removeAfter
      }

      return options

    }

    function remove ( callback ) {
      requestAnimationFrame( function(){
        settings.parent.removeChild( element() )
        el = null
        if ( typeof callback === 'function' ) callback()
      })
    }

    return {
      options  : settings,
      loading  : loading,
      success  : success,
      failure  : failure,
      show     : show,
      element  : element,
      remove   : remove
    }
  },

  defaults: function ( options ) {
    return Object.assign( defaultSettings, options || {} )
  }
}

// Public API
module.exports = Loader