docs: function(type, content, opts, onOk, onCancel) {
          // for if argument opts is not given.
          var detect = typeof opts === 'function';
          if (detect) {
            onCancel = onOk;
            onOk = opts;
          }
  
          var $oldModal = document.querySelector('.alerty');
  
  
          // if previous modal is open, remove it and immediately callback
          if ($oldModal) {
            commonUse.removeElement($oldModal);
            var _callback = this.previousCallback;
            if (_callback) _callback();
          }
  
          var $wrapper = document.createElement('div');
          $wrapper.innerHTML = this.template;
  
          // append alerty to body
          while ($wrapper.firstChild) {
            document.body.appendChild($wrapper.firstChild);
          }
  
          // cache alerty dom for next use
          var $modal = document.querySelector('.alerty');
          var $overlay = document.querySelector('.alerty-overlay');
          var $title = $modal.querySelector('.alerty-title');
          var $message = $modal.querySelector('.alerty-message');
          var $btnArea = $modal.querySelector('.alerty-action');
          var $btnOk = $modal.querySelector('.btn-ok');
          var $btnCancel = $modal.querySelector('.btn-cancel');
          var $prompt = $modal.querySelector('.alerty-prompt');
          var $input = $prompt.querySelector('input');
  
          // set uid
          $modal.id = commonUse.setUid('alerty');
          $overlay.id = 'overlay-'+$modal.id;
  
          // animation show alerty
          commonUse.addClass($overlay, 'active');
          commonUse.addClass($modal, 'alerty-show');
          $message.innerHTML = content;  // set msg
  
          if (opts && opts.time) this.defaults.time = opts.time; // handle time if set
  
          if (type !== 'prompt') {
            commonUse.removeElement($prompt); // other type do not need
          } else {
            $input.focus(); // auto focus input if type prompt
  
            if(opts && opts.inputType) $input.setAttribute('type', opts.inputType); // handle input type, such as 'password'
            if(opts && opts.inputPlaceholder) $input.setAttribute('placeholder', opts.inputPlaceholder); // handle input placeholder
            if(opts && opts.inputValue) $input.setAttribute('value', opts.inputValue); // handle input default value 
          }
  
          if (type === 'toasts') {
            this.previousCallback = onOk;  // cache callback
  
            // rearrange template
            commonUse.removeElement($title);
            commonUse.removeElement($btnArea);
            commonUse.removeElement($overlay);
            commonUse.addClass($modal, 'toasts');
  
            if (opts && opts.place === 'top') commonUse.addClass($modal, 'place-top'); // handle toasts top place
            if (opts && opts.bgColor) $modal.style.backgroundColor = opts.bgColor;
            if (opts && opts.fontColor) $message.style.color =opts.fontColor;
  
          } else {
            commonUse.addClass(document.body, 'no-scrolling'); // body no scorll
            (opts && opts.title) ? $title.innerHTML = opts.title : commonUse.removeElement($title); // handle title if set
            (opts && opts.okLabel) ? $btnOk.innerHTML = opts.okLabel : $btnOk.innerHTML = this.defaults.okLabel; // handle ok text if set
            $modal.style.marginTop =  - $modal.offsetHeight / 2 + 'px'; // set the place to center using margin-top;
  
            if (type === 'confirm' || type === 'prompt') {
              (opts && opts.cancelLabel) ? $btnCancel.innerHTML = opts.cancelLabel : $btnCancel.innerHTML = this.defaults.cancelLabel; // handle cancel text if set
            } else {
              commonUse.removeElement($btnCancel); // toasts and alery type do not need cancel btn
            }
          }
  
          this.bindEvent($modal, onOk, onCancel); // see next
        }