'use strict';
(function () {

  angular.module('foToast', []).factory('foToast', foToast);

  foToast.$inject = ['$animate', '$injector', '$document', '$rootScope', '$sce', 'foToastConfig', '$q', '$compile', '$timeout'];

  function foToast($animate, $injector, $document, $rootScope, $sce, foToastConfig, $q, $compile, $timeout) {

    var templateString = '\n      <div class="fo-toast {{toast.class}}">\n        <div style="opacity: 0; line-height: 1px; height: 1px;">fix tehter bug</div>\n        {{toast.message}}\n      <div>\n    ';

    var $body = angular.element($document).find('body');
    var $toast = angular.element(templateString);

    $body.append($toast);

    var scope = $rootScope.$new();

    $compile($toast)(scope);

    scope.toast = {};

    return {
      error: error,
      info: info,
      success: success,
      warning: warning,
      remove: remove,
      clear: clear
    };

    // Public Api
    function success(message, title, id, options) {
      return notify({
        type: 'success',
        message: message,
        title: title,
        id: id,
        options: options
      });
    }

    function error(message, title, id, options) {
      return notify({
        type: 'error',
        message: message,
        title: title,
        id: id,
        options: options
      });
    }

    function info(message, title, id, options) {
      return notify({
        type: 'info',
        message: message,
        title: title,
        id: id,
        options: options
      });
    }

    function warning(message, title, id, options) {
      return notify({
        type: 'warning',
        message: message,
        title: title,
        id: id,
        options: options
      });
    }

    function remove() {
      // body...
    }

    function clear() {}
    // body...

    /////////////////////////////////////////////////////////////
    function notify(map) {

      scope.toast = {
        message: map.message,
        title: map.title,
        'class': 'toast-' + map.type
      };

      var tetherOption = {
        element: $toast[0],
        target: document.querySelector(map.id),
        attachment: 'top middle',
        targetAttachment: 'bottom middle',
        offset: '-10 0'
      };

      $toast.addClass('show');

      new Tether(tetherOption);

      $timeout(function () {
        $toast.removeClass('show');
      }, 2500);
    }
  }
})();

'use strict';

angular.module('foToast').constant('foToastConfig', {
  allowHtml: false,
  autoDismiss: false,
  closeButton: false,
  closeHtml: '<button>&times;</button>',
  containerId: 'toast-container',
  extendedTimeOut: 1000,
  iconClasses: {
    error: 'toast-error',
    info: 'toast-info',
    success: 'toast-success',
    warning: 'toast-warning'
  },
  maxOpened: 0,
  messageClass: 'toast-message',
  newestOnTop: true,
  onHidden: null,
  onShown: null,
  onTap: null,
  positionClass: 'toast-top-right',
  preventDuplicates: false,
  preventOpenDuplicates: false,
  progressBar: false,
  tapToDismiss: true,
  target: 'body',
  templateUrl: 'views/toast.html',
  timeOut: 5000,
  titleClass: 'toast-title',
  toastClass: 'toast'
});