Индикатор загрузки с применением JS

Простой и удобный индикатор загрузки.
Подсчитывает количество показов и скрытий и не прячется, пока последняя загрузка
для которой был вызван не завершится (не будет вызван последний hide())
Также имеет возможность задать внутреннее содержимое индикатора,
методом setHtml(html) или при вызове show(html)

14.11.2024: Слегка обновил код, добавил возможность в конструкторе задать место, куда он будет установлен, обычным селектором. 
Включили этот простой, но полезный скрипт в один из продуктов

Для работы индикатора необходим jQuery!


Стиль: 
<style>
  .loading-indicator {
    position: fixed;
    z-index: 1002;
    background-color: red;
  }
</style>

Скрипт JS:
<script>
// LOADING INDICATOR
function loadingIndicator(){
    this.counter = 0;
    this.element = jQuery('<div />',{
        class   : 'loading-indicator'
    }).css('display', 'none').html('<img alt="ЗАГРУЗКА" src="/img/ajax-loader.gif" />').prependTo('body');

    this.setHtml = function(html){
        this.element.html(html);
    };
    
    this.show = function(html){
        var tmp = null;
        if (html != 'undefined') {
            tmp = this.element.html();
            this.setHtml = html;    
        }
        this.element.show();
        this.counter++;
        
        if (tmp !== null) {
            this.setHtml = tmp;    
        }
    };

    this.hide = function(){
        if (this.counter > 0) this.counter--;
        if (this.counter <= 0) {
            this.element.hide();
        }
    };
};

var lid = new loadingIndicator();

lid.show(); //Показать
lid.hide(); //Скрыть
</script>