decentralized-video-chat/public/js/snackbar.js

/*!
 * Snackbar v0.1.14
 * http://polonel.com/Snackbar
 *
 * Copyright 2018 Chris Brame and other contributors
 * Released under the MIT license
 * https://github.com/polonel/Snackbar/blob/master/LICENSE
 */

(function (root, factory) {
  "use strict";

  if (typeof define === "function" && define.amd) {
    define([], function () {
      return (root.Snackbar = factory());
    });
  } else if (typeof module === "object" && module.exports) {
    module.exports = root.Snackbar = factory();
  } else {
    root.Snackbar = factory();
  }
})(this, function () {
  var Snackbar = {};

  Snackbar.current = null;
  var $defaults = {
    text: "Default Text",
    textColor: "#FFFFFF",
    width: "auto",
    showAction: true,
    actionText: "Dismiss",
    actionTextAria: "Dismiss, Description for Screen Readers",
    alertScreenReader: false,
    actionTextColor: "#4CAF50",
    showSecondButton: false,
    secondButtonText: "",
    secondButtonAria: "Description for Screen Readers",
    secondButtonTextColor: "#4CAF50",
    // backgroundColor: "#323232",
    pos: "bottom-left",
    duration: 5000,
    customClass: "",
    onActionClick: function (element) {
      element.style.opacity = 0;
    },
    onSecondButtonClick: function (element) {},
    onClose: function (element) {},
  };

  Snackbar.show = function ($options) {
    var options = Extend(true, $defaults, $options);

    if (Snackbar.current) {
      Snackbar.current.style.opacity = 0;
      setTimeout(
        function () {
          var $parent = this.parentElement;
          if ($parent)
            // possible null if too many/fast Snackbars
            $parent.removeChild(this);
        }.bind(Snackbar.current),
        500
      );
    }

    Snackbar.snackbar = document.createElement("div");
    Snackbar.snackbar.className = "snackbar-container " + options.customClass;
    Snackbar.snackbar.style.width = options.width;
    var $p = document.createElement("p");
    $p.style.margin = 0;
    $p.style.padding = 0;
    $p.style.color = options.textColor;
    $p.style.fontSize = "14px";
    $p.style.fontWeight = 300;
    $p.style.lineHeight = "1em";
    $p.innerHTML = options.text;
    Snackbar.snackbar.appendChild($p);
    // Snackbar.snackbar.style.background = options.backgroundColor;

    if (options.showSecondButton) {
      var secondButton = document.createElement("button");
      secondButton.className = "action";
      secondButton.innerHTML = options.secondButtonText;
      secondButton.setAttribute("aria-label", options.secondButtonAria);
      secondButton.style.color = options.secondButtonTextColor;
      secondButton.addEventListener("click", function () {
        options.onSecondButtonClick(Snackbar.snackbar);
      });
      Snackbar.snackbar.appendChild(secondButton);
    }

    if (options.showAction) {
      var actionButton = document.createElement("button");
      actionButton.className = "action";
      actionButton.innerHTML = options.actionText;
      actionButton.setAttribute("aria-label", options.actionTextAria);
      actionButton.style.color = options.actionTextColor;
      actionButton.addEventListener("click", function () {
        options.onActionClick(Snackbar.snackbar);
      });
      Snackbar.snackbar.appendChild(actionButton);
    }

    if (options.duration) {
      setTimeout(
        function () {
          if (Snackbar.current === this) {
            Snackbar.current.style.opacity = 0;
            // When natural remove event occurs let's move the snackbar to its origins
            Snackbar.current.style.top = "-100px";
            Snackbar.current.style.bottom = "-100px";
          }
        }.bind(Snackbar.snackbar),
        options.duration
      );
    }

    if (options.alertScreenReader) {
      Snackbar.snackbar.setAttribute("role", "alert");
    }

    Snackbar.snackbar.addEventListener(
      "transitionend",
      function (event, elapsed) {
        if (event.propertyName === "opacity" && this.style.opacity === "0") {
          if (typeof options.onClose === "function") options.onClose(this);

          this.parentElement.removeChild(this);
          if (Snackbar.current === this) {
            Snackbar.current = null;
          }
        }
      }.bind(Snackbar.snackbar)
    );

    Snackbar.current = Snackbar.snackbar;

    document.body.appendChild(Snackbar.snackbar);
    var $bottom = getComputedStyle(Snackbar.snackbar).bottom;
    var $top = getComputedStyle(Snackbar.snackbar).top;
    Snackbar.snackbar.style.opacity = 1;
    Snackbar.snackbar.className =
      "snackbar-container " +
      options.customClass +
      " snackbar-pos " +
      options.pos;
  };

  Snackbar.close = function () {
    if (Snackbar.current) {
      Snackbar.current.style.opacity = 0;
    }
  };

  // Pure JS Extend
  // http://gomakethings.com/vanilla-javascript-version-of-jquery-extend/
  var Extend = function () {
    var extended = {};
    var deep = false;
    var i = 0;
    var length = arguments.length;

    if (Object.prototype.toString.call(arguments[0]) === "[object Boolean]") {
      deep = arguments[0];
      i++;
    }

    var merge = function (obj) {
      for (var prop in obj) {
        if (Object.prototype.hasOwnProperty.call(obj, prop)) {
          if (
            deep &&
            Object.prototype.toString.call(obj[prop]) === "[object Object]"
          ) {
            extended[prop] = Extend(true, extended[prop], obj[prop]);
          } else {
            extended[prop] = obj[prop];
          }
        }
      }
    };

    for (; i < length; i++) {
      var obj = arguments[i];
      merge(obj);
    }

    return extended;
  };

  return Snackbar;
});