/*
MARKUP

<div class="col-3 rounded shadow">
    <ul id='idList_XXX' class='uaScrollable ps-0'></ul>
</div>

NOTE:
Control list height w/ css: { #idList_XXX {height: xxx}
 */


$.fn.uaList = function(options)
{//ul
    options = $.extend({
                        bSort:      false,
                        bByLabel:   true, //how to insert, update or delete. NOTE: ev.uaData.info.bByLabel has priority, just in case
                        default:    {
                                        label:  "<span class='text-danger'>Not Available</span>",
                                        id:     ID_SELECTION_NONE
                                    }
                        },options);
                   
    this.
        on(EV_INIT,function(ev)
        {//initial values 
            ev.stopImmediatePropagation();         
        }).
        on(EV_INSERT,function(ev)
        {
            ev.stopImmediatePropagation();

            $(this).trigger($.Event(EV_SET,{uaData:{data:[ev.uaData.data]}}));
            $.each($('.text-primary',this),function()
            {
                $(this).removeClass('text-primary');
            });
            
            if(!options.bSort) return;
            $(this).trigger(EV_SORT);
        }).  
        on(EV_UPDATE,function(ev)
        {//delete + insert. 
            ev.stopImmediatePropagation();
            let theID = null;
            
            switch(!ev.uaData.info.bByLabel ? options.bByLabel : ev.uaData.info.bByLabel)
            {
                case true://update by label. IF a different ID
                    $(this).
                            trigger($.Event(EV_DELETE,{uaData:ev.uaData})).
                            trigger($.Event(EV_INSERT,{uaData:ev.uaData}));
                    
                    if(options.bSort)
                    {
                        $(this).trigger(EV_SORT);
                    };
                    break;
                    
                case false://update by id. IF a different label
                    theID = JSON.stringify(ev.uaData.data.id);
                    $.each($('li',this),function()
                    {
                        if( $(this).attr('id') !== theID) return true;
                        $(this).html(ev.uaData.data.label);
                        return false;
                    });  
                    
                    $.each($('.text-primary',this),function()
                    {
                        $(this).removeClass('text-primary');
                    });                    
                    if(!options.bSort) return;
                    $(this).trigger(EV_SORT);                    
                    break;
                    
                default:
                    break;
            };//switch(!ev.uaData.info.bByLabel ? options.bByLabel : ev.uaData.info.bByLabel)
        }).
        on(EV_DELETE,function(ev)
        {
            ev.stopImmediatePropagation();
            let theID = null;
            
            switch(!ev.uaData.info.bByLabel ? options.bByLabel : ev.uaData.info.bByLabel)
            {
                case true:
                    $.each($('li',this),function()
                    {
                        if($(this).html()!==ev.uaData.data.label) return true;
                        $(this).remove();
                        return false;
                    });                    
                    break;
                    
                case false: 
                    theID = JSON.stringify(ev.uaData.data.id);
                    $.each($('li',this),function()
                    {
                        if( $(this).attr('id') !== theID) return true;
                        $(this).rmove();
                        return false;
                    });
                    break;
                    
                default:
                    break;
            };//switch(!ev.uaData.info.bByLabel ? options.bByLabel : ev.uaData.info.bByLabel)                                     
        }).                
        on(EV_CLEAR,function(ev)
        {
            ev.stopImmediatePropagation();  
            $(this).html('');
        }). 
        on(EV_SET_DEFAULT,function(ev)
        {
            ev.stopImmediatePropagation();
            
            $.each($('.text-primary',this),function()
            {
                $(this).removeClass('text-primary').addClass('text-dark');
            });
            if(!options.bSort) return;
            $(this).trigger(EV_SORT);
        }).
        on(EV_SORT,function(ev)
        {
            ev.stopImmediatePropagation();    
      
            let pItems = $('li',this);
            pItems.sort((a, b) => a.textContent.localeCompare(b.textContent));    
            $(this).trigger(EV_CLEAR);
            $.each(pItems,function()
            {
                meList.append(this);
            });
                        
            $.each($('li',this),function()
            {
                $(this).
                        off('click').
                        on('click',function(ev)
                        {
                            ev.stopImmediatePropagation();    
           
                            $(this).
                                    trigger($.Event(EV_EXTERN,{uaData:{info:{ev:'ev.FromList'},data:{label:$(this).html(),id:JSON.parse($(this).attr('id'))}}})).
                                    removeClass('text-dark').addClass('text-primary');
                        });
            });            
        }).        
        on(EV_SET,function(ev)
        {
            ev.stopImmediatePropagation();

            switch(ev.uaData.data.length)
            {
                case 0:// w/o data => show options above
                    $(this).append($("<li />").uaItem_List().
                                                on(EV_EXTERN,function(ev)
                                                {
                                                    ev.stopImmediatePropagation();                                              
                                                    //if NO selection => do not trigger EXTERN as there is nothing to show
                                                    //if(ev.uaData.data.id===ID_SELECTION_NONE) return;
                                                    //$(this).parent().trigger($.Event(EV_NOTIFY,{uaData:ev.uaData}));
                                                })); 
                                                
                    $('li:last',this).trigger($.Event(EV_INIT,{uaData:{data:options.default}}));                            
                    break;
                    
                default:// w/ data
                    
                    if($(this).data().strHighlight)
                    {
                       pRegEx = new RegExp(`(${$(this).data().strHighlight})`, "gi"); // Case-insensitive global match 
                    };
                    
                    $.each(ev.uaData.data,function()
                    {
                        meList.append($("<li />").uaItem_List().
                                                    //trigger($.Event(EV_INIT,{uaData:{data:this}}))).
                                                    on(EV_EXTERN,function(ev)
                                                    {
                                                        ev.stopImmediatePropagation();   
                                                      
                                                        meList.trigger($.Event(EV_NOTIFY,{uaData:ev.uaData}));
                                                    }));
                        
                        //need for highlighht?
                        switch(meList.data().strHighlight)
                        {
                            case undefined:
                                $('li:last',meList).trigger($.Event(EV_INIT,{uaData:{data:this}}));
                                break;
                                
                            default://highlight BEFORE showing
                                this.label = this.label.replace(
                                                                    pRegEx,
                                                                    '<span class="uaHighlight">$1</span>' // Wrap matches in a span
                                                                );
                            
                                break;
                        };  
                        
                        $('li:last',meList).trigger($.Event(EV_INIT,{uaData:{data:this}}));
                    });    
                    
                    //remove strHighlight so that there is no need to highlight again based on the same snippet
                    $(this).removeData();
                    pRegEx = null;
                    
                    if(options.bSort) 
                    {
                        $(this).trigger(EV_SORT); 
                    };//if
                    break;
            };//switch(ev.uaData.data.length)

        }).  
        on(EV_HIGHLIGHT,function(ev)
        {//Expected: *strHighlight ( => ev.uaData.data.strHighlight)
            ev.stopImmediatePropagation();  
            
            $(this).data({
                            strHighlight:   ev.uaData.data.strHighlight
                          });
        }).
        on(EV_NOTIFY,function(ev)
        {
            ev.stopImmediatePropagation();           
            //remove previous selection
            $.each($('.text-primary',this),function()
            {
                //$(this).addClass('text-dark').removeClass('text-primary');
                $(this).removeClass('text-primary');
            });
            
            //trigger an extern
            $(this).trigger($.Event(EV_EXTERN,{uaData:ev.uaData}));                
        });
    
    $.fn.uaItem_List = function()
    {//li        
        this.
            on(EV_INIT,function(ev)
            {
                ev.stopImmediatePropagation();
                $(this).
                        html(ev.uaData.data.label).addClass('text-dark').
                        attr({id:JSON.stringify(ev.uaData.data.id)});
            }).
            on('click',function(ev)
            {
                ev.stopImmediatePropagation();    

                            switch($('span',this).length)
                            {
                                case 0:
                                    $(this).
                                            trigger($.Event(EV_EXTERN,{uaData:{info:{ev:'ev.FromList'},data:{label:$(this).html(),id:JSON.parse($(this).attr('id'))}}})).
                                            removeClass('text-dark').addClass('text-primary');                                    
                                    break;
                                    
                                default:
                                    $(this).
                                            trigger($.Event(EV_EXTERN,{uaData:{info:{ev:'ev.FromList'},data:{label:$('span:last',this).html(),id:JSON.parse($(this).attr('id'))}}})).
                                            removeClass('text-dark').addClass('text-primary');                                
                                    break;
                            };        
            });
        
        $(this).addClass('pb-2 uaSelectable');
        return this;
    };//$.fn.uaItem_List = function()
         
    this.getSelection_ById = function(theID)
    {
        let pResp = null;

        theID = JSON.stringify(theID);
                
        $.each($('li',this),function()
        {
            if($(this).attr('id') !==theID) return true;
            pResp = {
                        label:  $(this).html(),
                        id:     JSON.parse($(this).attr('id'))
                    };
            return false;
        });

        return pResp;                    
    };//this.getSelection_ById = function(theID)

    this.getSelection_ByText = function(strText)
    {
        let pResp = null;

        $.each($('li',this),function()
        {
            if($(this).html() !==strText) return true;
            pResp = {
                        label:  $(this).html(),
                        id:     JSON.parse($(this).attr('id'))
                    };
            return false;
        });

        return pResp;                    
    };//this.getSelection_ByText = function(strText)  
            
    this.setItem_Selected = function(pItem)
    {//set the selected item    
              
        //bug * bug * bug => clear previous selecvtion, if any
        $.each( $('.text-primary',this),function()
        {
            $(this).removeClass('text-primary').addClass('text-dark');
        });
        
        if(!pItem) return;
        
        pItem.id = JSON.stringify(pItem.id);
        
        $.each($('li',this),function()
        {
            if($(this).attr('id') !==pItem.id) return true;
            $(this).addClass('text-primary');
            return false;
        });        
    };//this.setItem_Selected = function(pItem)

    this.getList_Items = function()
    {
        let pResp=[];
        $.each($('li',this),function()
        {
            pResp.push({
                            label:  $(this).html(),
                            id:     JSON.parse($(this).attr('id'))
                        });
        });
        return pResp;
    };//this.getList_Items = function()
       
    this.getList_Item_Ids = function()
    {
        let pResp=[];
        $.each($('li',this),function()
        {
            pResp.push({
                            id: JSON.parse($(this).attr('id'))
                        });
        });
        return pResp;
    };//this.getList_Item_Ids = function()
    
    let pRegEx = null;
    
    const meList = this;
    return this;
};