AssetSearch = function() {

    this.publishedOptions = [
        {"statusCode":"Y","desc":"Active"},
        {"statusCode":"N","desc":"Expired"},
        {"statusCode":"F","desc":"Future"}    
   ];


}

AssetSearch.prototype.constructor = AssetSearch;

AssetSearch.prototype._createSearchItems = function() {

    let instance = this;
    let searchItems = [];

    let searchItemsPromise = $.Deferred();


    searchItemsPromise.done( function() {
        //console.log( "promise done" );
    })

    let waitingCount = 0;
    searchItemsPromise.progress( function() {
        waitingCount--;
        if( ! waitingCount ) {
            searchItemsPromise.resolve( searchItems );
        }
    })

    let assetTypeDataSource = Fse.Data.newDataSource( { object : "CMA.assetTypes", keyField : "fileExt" } );

    let classificationDataSource = Fse.Data.newDataSource( { object : "DOC.categories", keyField : "categoryId", paginate : false});


    let resourceIdsItem = 
        { dataField : "resourceIds", label : { location : "left", text : "Group" }, editorType : "dxDropDownBox", 
        editorOptions : {
            placeholder : "Select Group(s)",
            valueExpr: "resourceId",
            displayExpr: "resourceDescription",
            grouped: true,
            showSelectionControls: true,
            selectionMode: "multiple",
      
            contentTemplate : function( e ) {
                const v = e.component.option( "value" );

                let list = $("<div>").dxList( {
                    dataSource : e.component.getDataSource(),
                    displayExpr : "resourceDescription",
                    grouped: true,
                    showSelectionControls: true,
                    selectionMode: "multiple",
                    keyExpr : "resourceId",
                    selectedItemKeys : v,

                   onSelectionChanged : function( sce ) {
                        const keys = sce.component.option( "selectedItemKeys" );

                       // console.log( "Keys Changed" );
                       // console.log( keys );
                        e.component.option( "value", keys );
                        //console.log( e.component.option( "value" ) );
                    },

                    onOptionChanged: function(args) {
                       /// console.log("inside options changed");
                       // console.log(args.name);
                        if (args.name === "selectedItemKeys") {
                          console.log("DropDownBox value changed:", args.value);
                        }
                       // console.log(args.value);
                      }
                      
                      

                }).dxList("instance");
                
        
                e.component.on('valueChanged', (args) => {
                    const { value } = args;
                    console.log( "Value Changed" );
                    console.log( value );
                    list.option( "selectedItemKeys", value );
                });

            return list.element();
            }
        }
        };


    let categoriesDataStore = Fse.Data.newDataSource( { object : "CMA.assetPermissions", keyField : "resourceId" });
    categoriesDataStore.filter( [ "resourceType", "=", "GRP" ] );

    waitingCount++; // moved it to here
    categoriesDataStore.load().done( function( data ) {

        let newDataSource = new DevExpress.data.DataSource({
                store: data,
                group: "resourceCategory" // Grouping by a specific column
            })
            resourceIdsItem.editorOptions.dataSource = newDataSource;
        searchItemsPromise.notify();
    });

    searchItems.push( resourceIdsItem ); 

    searchItems.push( { dataField : "classificationId", label : { location : "left", text : "Classification" }, editorType : "dxDropDownBox", 
        editorOptions : Fse.UI.multiSelectDropDownBoxEditorOptions( {
            dataSource : classificationDataSource,
            searchExpr : "categoryName",
            searchMode : "contains",
            displayExpr : "categoryName",
            multipleSelectedDisplay : "Multiple Classification Selected",
            keyExpr : "categoryId",
            title : "Select Classification"
        })
    },

        { dataField : "docType", label : { location : "left", text : "Type" }, editorType : "dxDropDownBox", 
        editorOptions : Fse.UI.multiSelectDropDownBoxEditorOptions( {
                dataSource : assetTypeDataSource,
                searchExpr : "fileType",
                searchMode : "contains",
                displayExpr : "fileType",
                multipleSelectedDisplay : "Multiple Doc Types Selected",
                keyExpr : "fileExt",
                title : "Select Document Type"
        })
    },
        
    
    { dataField : "isPublished", label : { location : "left", text : "Published" }, editorType : "dxDropDownBox", 
    editorOptions : {
        placeholder : "Select Status",
        dataSource : new DevExpress.data.ArrayStore({
            data: instance.publishedOptions,
            key: "statusCode"
        }) ,
        valueExpr : "statusCode", displayExpr : "desc",
        contentTemplate : function( e ) {
            const v = e.component.option( "value" );
            const $list = $("<div>").dxList( {
                dataSource : e.component.getDataSource(),
                displayExpr : "desc",
                selectionMode: "all",
                showSelectionControls : true,
                selectedItemKeys : v,
                onSelectionChanged : function( sce ) {
                    const keys = sce.component.option( "selectedItemKeys" );
                    e.component.option( "value", keys );
                }
            })
            
            list = $list.dxList('instance');
    
            e.component.on('valueChanged', (args) => {
            const { value } = args;
            list.option( "selectedItemKeys", value );
            });
    
            return $list;
        }
    }
    },	
    
    { dataField : "privateYesNo", label : { location : "left", text : "Restricted" }, editorType : "dxSelectBox", 
    editorOptions : {
        
        dataSource : {
    
            store : { type : "array", 
                        data : [ 
                        { text : "Yes", privateYesNo : "Y" },
                        { text : "No", privateYesNo : "N" }
                        ],
                        key : "privateYesNo"
                    }
    
        },
    
        showClearButton : true,
        placeholder: "Select Restricted",
        displayExpr: "text",
        searchEnabled : true,
        searchMode : "startswith",
        searchExpr : "text",
        valueExpr: "privateYesNo"
    }
    
    }
    );

   

    if( Fse.Portal.appConfiguration.STP.ownerType === "BRO" ) {
       
        searchItems.push(
            {
                dataField : "mfrId", label : { text : "Manufacturer" }, isRequired : false, editorType : "dxSelectBox", editorOptions : {
                    searchEnabled : true, searchMode : "startswith",
                    dataSource : Fse.Data.newDataSource( { object : "BPL.principals", keyField : "mfr_id", paginate : true } ),
                    searchEnabled : true,
                    searchExpr : "mfr_name",
                    valueExpr : "mfr_id",
                    displayExpr : "mfr_name"
                }
            }

        );
    }

    searchItems.push(
   
      { dataField : "product", label : { location : "left", text : "Product" }, editorType : "dxDropDownBox", 
	
      editorOptions : Fse.UI.multiSelectDropDownBoxEditorOptions( {
              dataSource : Fse.Data.newDataSource( { object : "PRD.productList", keyField : "prodId", paginate : false } ),
              searchExpr : "product",
              searchMode : "contains",
              displayExpr : "product",
              multipleSelectedDisplay : "Multiple Products Selected",
              keyExpr : "prodId",
              title : "Select Product",
              
      })
},

      { dataField : "sku", label : { location : "left", text : "SKU" }, editorType : "dxDropDownBox", 
	
			editorOptions : Fse.UI.multiSelectDropDownBoxEditorOptions( {
					dataSource : Fse.Data.newDataSource( { object : "PRD.skuList", keyField : "skuId", paginate : false } ),
					searchExpr : "skuFull",
					searchMode : "contains",
					displayExpr : "skuFull",
					multipleSelectedDisplay : "Multiple SKUs Selected",
					keyExpr : "skuId",
					title : "Select SKU",
					
			})
	  }
    );

    if( Fse.Portal.appConfiguration.STP.ownerType === "MFR" ) {
        searchItems.push(
            {
                dataField : "broId", label : { text : "Broker" }, isRequired : false, editorType : "dxSelectBox", editorOptions : {
                    searchEnabled : true, searchMode : "startswith",
                    dataSource : Fse.Data.newDataSource( { object : "MFR.activeBrokers", keyField : "brokerId", paginate : true } ),
                    searchEnabled : true,
                    searchExpr : "brokerName",
                    valueExpr : "brokerId",
                    displayExpr : "brokerName"
                }
            }

        );
    }


    let distDataStore = Fse.Data.newDataSource( { object : "CDR.distributors", keyField : "distId" , paginate : true});
    distDataStore.filter( [ "crmActive", "=", "Y" ] );

    distDataStore.load();

    searchItems.push(
        {
            dataField : "distId", label : { text : "Distributor" }, isRequired : false, editorType : "dxSelectBox", editorOptions : {
                searchEnabled : true, searchMode : "startswith",
                dataSource :distDataStore,
                searchEnabled : true,
                searchExpr : "distName",
                valueExpr : "distId",
                displayExpr : "distName"
            }
        },

        {
            dataField : "oprId", label : { text : "Operator HQ" }, isRequired : false, editorType : "dxSelectBox", editorOptions : {
                searchEnabled : true, searchMode : "startswith",
                dataSource : Fse.Data.newDataSource( {object : "OPR.operatorHQList", keyField : "OperatorID", paginate : true} ),
                searchEnabled : true,
                searchExpr : "oprCompanyName",
                valueExpr : "OperatorID",
                displayExpr : "oprCompanyName"
            }
        }
    );

return searchItemsPromise;

}

AssetSearch.prototype._prepareFormData = function( data ) {

    let formDataPromise = $.Deferred();
    console.log( "prepareFormData", data );

    let assetPermissionDataSource = Fse.Data.newDataSource( { object : "CMA.assetPermissions", paginate : true, pageSize : 50, objectParams : { assetId : data.fileId, assetType : data.contentDomain} });
    assetPermissionDataSource.load().done( function( assetPermissions ) {

        //console.log( "assetPermissions", assetPermissions );

        let assetDefaults = {
           // privateYesNo : data.privateYesNo == 'Y' ? true : false,
           
            isPublished : ["Y","F"],
        };            

        formDataPromise.resolve( assetDefaults );
    })

    return formDataPromise;
}

AssetSearch.prototype.show = function( options ) {

    
    console.log( "inside show" );
    console.log( options );

let instance = this;

instance._createSearchItems().done( function( formItems ) {

    let data = { fileId : 0 }; 


    console.log( "formItems", formItems );
    console.log( data );

    instance._prepareFormData( data ).done( function( assetDefaults ) {

        if(options.searchParams)
        {
            assetDefaults =  $.extend( true, assetDefaults, options.searchParams );
        }
   

        console.log( "assetDefaults", assetDefaults );
        instance.searchForm = $( "<div>").dxForm( {
            formData : assetDefaults,
            colCount : 1,
            items : formItems,
            
           
        }).dxForm( "instance" );

        let popup = $("<div>").dxPopup( {
            title : "Asset Search",

            onHidden : function( e ) {
                popup.element().remove();
                popup.dispose();
                instance.searchForm.dispose();
            },

            contentTemplate : function() {
                return instance.searchForm.element()
            },

            toolbarItems : [
                /*{ toolbar : "bottom", location : "after", 
                widget : "dxButton", options : {
                    text : "Reset All",
                    onClick  : function( e ) {
                            instance.searchForm.option( "formData", {isPublished : ["Y","F"]} );
                    }
                    }
                },*/
                { toolbar : "bottom", location : "after", 
                    widget : "dxButton", options : {
                        text : "clear",
                        onClick  : function( e ) {
                                instance.searchForm.option( "formData", {} );                   
                        }
                        }
                    },
                { toolbar : "bottom", location : "after", 
                    template : function() {
                        instance.searchButton = $("<div>").css( { "background-color" : "#4b286d", "color": "white" } ).dxButton( {
                            text : "search",
                            onClick : function( ) { 
                                let searchParams = $.extend( true, {}, instance.searchForm.option( "formData" ));
                                console.log( "searchParams" );
                                console.log( searchParams );
    
                            
                                //searchParams.resourceIds = searchParams.resourceId;
                                options.onSearch( searchParams );
                                popup.hide();
                            }
                        }).dxButton("instance")
                        return instance.searchButton.element()
                    }
                }
            ]

        }).appendTo( "body" ).dxPopup("instance");

        popup.show();
    })

   });








}