OperatorMergePopup = function( options ) {

    let instance = this;
    instance.keepOperatorId = options.keepOperatorId;
    instance.mergeOperatorId = options.mergeOperatorId;
    instance.dataGrid = options.dataGrid;

}

OperatorMergePopup.prototype.constructor = OperatorMergePopup;


OperatorMergePopup.prototype.show = function() {
    //alert( 'Hello World!' );

    let instance = this;

    if( instance.popup ) {
        instance.popup.dispose();
        instance.popup.element().remove();
    }

    instance.popup = $("<div>").dxPopup( {
        title : "Operator Merge Tool",
        width : 800,
        showCloseButton: false,
        contentTemplate : function( contentElement ) {
            instance.contentElement = contentElement;

            //contentElement.append( '<div>Loading...</div>' );

            const loadPanel = $( '<div>' ).dxLoadPanel({
                container: instance.popup.content(),
                visible: false,
                showIndicator: true,
                showPane: true,
                shading: true,
                hideOnOutsideClick: false,
                message: 'Loading...',
            }).appendTo( instance.popup.content() ).dxLoadPanel('instance');

            loadPanel.show();
            
            $.ajax({
                url: Fse.Util.updateURL2( $("link#PortalDocRootURL").attr("href") + '/apps/OPR/index.cfm', { get : 'operatorMergeTool', kOpId : instance.keepOperatorId, mOpId : instance.mergeOperatorId } ),
                method: 'GET',
                success: function( data ) {
                    contentElement.empty();
                    contentElement.append( data );
                    instance.mergeButton.option( "disabled", false );
                    instance.flipFlopButton.option( "disabled", false );
                },
                headers: {
                    fseAjax : true
                }
            });
        },
        toolbarItems: [{
            toolbar : 'top',
            location : 'after',
            template : function() {
                instance.flipFlopButton = $("<div>").dxButton( {
                    text : "Swap",
                    stylingMode : "text",
                    disabled : true,
                    onClick : function( e ) {
                        
                        let nKeepOperatorId = $( '#keepOperatorId' ).val();
                        let nDeleteOperatorId = $( '#deleteOperatorId' ).val();
                        
                        if( nKeepOperatorId && nDeleteOperatorId ) {
                            instance.contentElement.empty();

                            const loadPanel = $( '<div>' ).dxLoadPanel({
                                container: instance.popup.content(),
                                visible: false,
                                showIndicator: true,
                                showPane: true,
                                shading: true,
                                hideOnOutsideClick: false,
                                message: 'Swapping...',
                            }).appendTo( instance.popup.content() ).dxLoadPanel('instance');
    
                            loadPanel.show();

                            instance.flipFlopButton.option( "disabled", true );
                            instance.mergeButton.option( "disabled", true );
                           
                            //instance.contentElement.append( '<div>Swapping...</div>' );

                            $.ajax({
                                url: Fse.Util.updateURL2( $("link#PortalDocRootURL").attr("href") + '/apps/OPR/index.cfm', { get : 'operatorMergeTool', kOpId : nDeleteOperatorId, mOpId : nKeepOperatorId } ),
                                method: 'GET',
                                success: function( data ) {
                                    //loadPanel.hide();
                                    instance.contentElement.empty();
                                    instance.contentElement.append( data );
                                    instance.flipFlopButton.option( "disabled", false );
                                    instance.mergeButton.option( "disabled", false );
                                },
                                headers: {
                                    fseAjax : true
                                }
                            });
                        }
                    }
                }).dxButton( "instance" );

                return instance.flipFlopButton.element();
            }
        }, {   
            toolbar : "bottom",
            location : "after",
            template : function() {

                instance.cancelButton = $("<div>").dxButton( {
                    text : "Cancel",
                    onClick : function( e ) {
                        instance.popup.hide();
                        instance.popup.element().remove();
                    }
                }).dxButton( "instance" );

                return instance.cancelButton.element();

            }
            
        },
        {   
            toolbar : "bottom",
            location : "after",
            template : function() {

                instance.mergeButton = $("<div>").dxButton( {
                    text : "Merge",
                    type : "default",
                    disabled : true,
                    onClick : function( e ) {
                        const $mergeAckCheckbox = $( "form[name='frm_merge'] input[name='mergeAck']" );

                        if( !$mergeAckCheckbox.is( ':checked' ) ){
                            alert( 'Please acknowledge that you indeed wish to merge these two operators.' );
                            return;
                        }
                        
                        let bMergeBlocked = false;
                        let deliveryLocationInputs = $( "input[name='deliveryLocation']" );

                        if( deliveryLocationInputs.length > 0 ) {
                            deliveryLocationInputs.each( function( index, element ) {
                                if( $( this ).val() !== '0' ) {
                                    bMergeBlocked = true;
                                    //alert( 'Merge not allowed. One of the operators is a claim delivery location.' );
                                    alert( 'Heads up!\n\nMerging these accounts is not possible right now as one of the operators is a delivery location from claims.\n\nWhat you can do:\n\nTo move forward, you can rename the operator instead. This is the only available option at the moment. If you need additional help, contact TELUS Support through Service Cloud.' );
                                    return false;
                                }
                            });
                        }
                        
                        if( bMergeBlocked ) {
                            instance.popup.hide();
                            instance.popup.element().remove();
                            return;
                        }

                        //instance.contentElement.empty();

                        const loadPanel = $( '<div>' ).dxLoadPanel({
                            container: instance.popup.content(),
                            visible: false,
                            showIndicator: true,
                            showPane: true,
                            shading: true,
                            shadingColor: 'rgba(0, 0, 0, 0.5)',
                            hideOnOutsideClick: false,
                            message: 'Merging...',
                        }).appendTo( instance.popup.content() ).dxLoadPanel('instance');

                        instance.flipFlopButton.option( "disabled", true );
                        instance.mergeButton.option( "disabled", true );
                        instance.cancelButton.option( "disabled", true );

                        loadPanel.show();

                        let mergeURL = Fse.Util.updateURL2( $("link#PortalDocRootURL").attr("href") + '/apps/OPR/index.cfm', { do : 'mergeOperators' } );

                        $.ajax({
                            url: mergeURL,
                            method: 'POST',
                            data: $( "form[name='frm_merge']" ).serialize(),
                            success: function( data, textStatus, jqXHR ) {
                                
                                let confirmationHeader = Fse.Ajax.getResponseHeader( jqXHR, 'x-fse-merge-confirmation' );
                                
                                if( confirmationHeader === 'succeeded' ) {
                                    DevExpress.ui.notify( { message: 'Merge Successful', width: 500, position: 'top center' }, 'success', 2000 );
                                } else {
                                    DevExpress.ui.notify( { message: 'Merge Failed', width: 500, position: 'top center' }, 'warning', 2000 );
                                }

                                loadPanel.hide();
                                instance.popup.hide();
                                instance.popup.element().remove();
                                
                                instance.dataGrid.refresh();
                            }
                        })/*.always( function() {
                            instance.popup.hide();
                            instance.popup.element().remove();
                        })*/
                    }
                }).dxButton( "instance");

                return instance.mergeButton.element();

            }
            
        }],
        onHidden: function() {
            instance.popup.dispose();
            instance.popup.element().remove();
        },
    }).dxPopup( 'instance' );

    instance.popup.element().appendTo( "body" );
    instance.popup.show();
}