hedera-web/js/htk/toast.js

161 lines
3.0 KiB
JavaScript

/**
* Class to show toast messages.
*/
module.exports =
{
maxMessages: 6
,timeout: 10 /* Seconds */
,_container: null
,_timeouts: null
,_topHeap: []
/**
* Shows a normal toast message.
*
* @param {String} message The message text
*/
,showMessage: function (message)
{
this._showText (message, 'message');
}
/**
* Shows a warning toast message.
*
* @param {String} message The message text
*/
,showWarning: function (message)
{
this._showText (message, 'warning');
}
/**
* Shows an error toast message.
*
* @param {String} message The message text
*/
,showError: function (message)
{
this._showText (message, 'error');
}
,pushTop: function (top)
{
this._topHeap.push (top);
this._refreshPosition ();
}
,popTop: function ()
{
var top = this._topHeap.pop ();
this._refreshPosition ();
return top;
}
,_refreshPosition: function ()
{
if (!this._container)
return;
var left;
var heapLen = this._topHeap.length;
if (heapLen > 0)
{
var top = this._topHeap[heapLen - 1];
var rect = top.getBoundingClientRect ();
left = (rect.left + parseInt (rect.width / 2) - window.pageXOffset) +'px';
}
else
left = '';
this._container.style.left = left;
}
/**
* Hides all currently displayed toast messages.
*/
,hide: function ()
{
if (!this._container)
return;
if (this._timeouts)
for (var i = 0; i < this._timeouts.length; i++)
clearTimeout (this._timeouts[i]);
this._timeouts = null;
document.removeEventListener ('mousedown', this.hideHandler);
Vn.Node.remove (this._container);
this._container = null;
this.nodes = [];
}
,_createContainer: function ()
{
if (!this._container)
{
var container = document.createElement ('div');
container.className = 'htk-toast';
document.body.appendChild (container);
this.hideHandler = this.hide.bind (this);
document.addEventListener ('mousedown', this.hideHandler);
this._timeouts = [];
this._container = container;
}
this._refreshPosition ();
}
,_showText: function (message, className)
{
this._createContainer ();
if (this._timeouts.length >= this.maxMessages)
this._onMessageTimeout ();
var toast = document.createElement ('div');
toast.className = className;
toast.addEventListener ('mousedown', this._onMessageMouseDown);
var textNode = document.createTextNode (message);
toast.appendChild (textNode);
this._container.appendChild (toast);
var timeoutId = setTimeout (this._onMessageTimeout.bind (this), this.timeout * 1000);
this._timeouts.push (timeoutId);
setTimeout (this._onShowToastTimeout.bind (this, toast), 50);
}
,_onShowToastTimeout: function (toast)
{
Vn.Node.addClass (toast, 'show');
}
,_onMessageTimeout: function ()
{
if (!this._container)
return;
var nodes = this._container.childNodes;
if (nodes.length > 0)
{
clearTimeout (this._timeouts.shift ());
Vn.Node.remove (nodes[0]);
}
if (nodes.length == 0)
this.hide ();
}
,_onMessageMouseDown: function (event)
{
event.stopPropagation ();
}
};