hedera-web/js/htk/toast.js

145 lines
3.0 KiB
JavaScript
Raw Normal View History

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