From 938d6a9cbd8d861aa768315a673d28b5586b7743 Mon Sep 17 00:00:00 2001
From: Ludovic CANDELLIER <ludovic.candellier@fundglobam.com>
Date: Mon, 27 Mar 2023 23:12:57 +0200
Subject: [PATCH] Enhance modal

---
 resources/views/load/layout/modal.blade.php | 292 ++++++++++++++------
 1 file changed, 200 insertions(+), 92 deletions(-)

diff --git a/resources/views/load/layout/modal.blade.php b/resources/views/load/layout/modal.blade.php
index eb850bbb..eb8965ac 100644
--- a/resources/views/load/layout/modal.blade.php
+++ b/resources/views/load/layout/modal.blade.php
@@ -1,105 +1,213 @@
 @if(!defined('LOAD_MODAL'))
 
 	@push('js')
+        @component('boilerplate::minify')
+            <script>
 
-		<script>
-			function openModal(title, form_id, url_open, url_save, callback, size, no_confirm, buttons, callback_after_loaded) {
-				var status = 0;
-				var dialog = bootbox.dialog({
-					title: title,
-					message: '<p><i class="fa fa-spin fa-spinner"></i> {{ __('loading') }} ...</p>',
-					size: size ? size : 'large',
-					scrollable: true,
-					buttons: buildModalButtons(form_id, no_confirm, buttons)
-				});
-									
-				dialog.init(function() {
-					$.get(url_open, function(data) {
-						dialog.find('.bootbox-body').html(data);
-						if (callback_after_loaded) {
-							eval(callback_after_loaded);
-						}
-						if (typeof(url_save) !== 'undefined') {
-							handlePostModal(form_id,url_save, callback);
-						}
-					});
-				});
-			}
+                // bootbox.setLocale('{{ App::getLocale() }}');
 
-			function changeModalContent(dialog, url, callback) {
-				dialog.init(function() {
-					$.get(url, function(data) {
-						dialog.find('.bootbox-body').html(data);
-						if (callback) {
-							eval(callback);
-						}
-					});
-				});	
-			}
+                function openModal(title, form_id, url_open, url_save, callback, size, no_confirm, options) {
+                    var status = 0;
 
-			function viewModal(url, size, title) {
-				var dialog = bootbox.dialog({
-					title: title ? title : 'Web viewer',
-					message: '<iframe style="border:0;" src="' + url + '" height="400" width="100%"></iframe>',
-					size: size ? size : 'xl',
-					scrollable: true,
-				});
-			}
+                    if (typeof(options) != 'undefined') {
+                        var className = (typeof(options['className']) == 'undefined') ? '' : options['className'];
+                        var onHide = (typeof(options['onHide']) == 'undefined') ? false : options['onHide'];
+                        var onHidden = (typeof(options['onHidden']) == 'undefined') ? false : options['onHidden'];
+                        var onShow = (typeof(options['onShow']) == 'undefined') ? false : options['onShow'];
+                        var onShown = (typeof(options['onShown']) == 'undefined') ? false : options['onShown'];
+                        var onPostModal = (typeof(options['onPostModal']) == 'undefined') ? false : options['onPostModal'];
+                    }
 
-			function viewWindow(url, size, title) {
-				var width = (size == 'sm') ? 400 : 600;
-				var title  = title ? title : 'Web viewer';
-				window.open(url,title,"menubar=no, status=no, scrollbars=no, menubar=no, width=" + width + ", height=400");
-			}
+                    var dialog = bootbox.dialog({
+                        title: title,
+                        message: '<p><i class="fa fa-spin fa-spinner"></i> {{ __('loading') }} ...</p>',
+                        size: size ? size : 'large',
+                        scrollable: true,
+                        className: className,
+                        onHide: function(e) {
+                            // console.log(status);
+                            if (onHide) {
+                                eval(onHide);
+                            }
+                        },
+                        onHidden: function(e) {
+                            // console.log(status);
+                            if (onHidden) {
+                                eval(onHidden);
+                            }
+                        },
+                        onShow: function(e) {
+                            var modal = e.target.firstChild;
+                            // console.log(modal);
+                            // console.log($('.close'));
+                            if (onShow) {
+                                eval(onShow);
+                            }
+                        },
+                        onShown: function(e) {
+                            var modal = e.target.firstChild;
+                            // console.log(modal);
+                            // console.log($('.close'));
+                            if (onShown) {
+                                eval(onShown);
+                            }
+                        },
+                        buttons: buildModalButtons(form_id, no_confirm, callback)
+                    });
 
-			function buildModalButtons(form_id, no_confirm, buttons) {
-				if (!no_confirm) {
-					var buttons = {
-						cancel: {
-							label: '{{ __('Annuler') }}',
-							className: 'btn-secondary'
-						},
-						confirm: {
-							label: '{{ __('Sauver') }}',
-							className: 'btn-success',
-							callback: function() {
-								submitModal(form_id);
-							}
-						},
-					};
-				}
-				return buttons; 
-			}
+                    dialog.init(function() {
+                        $.get(url_open, function(data) {
+                            dialog.find('.bootbox-body').html(data);
+                            handlePostModal(form_id, url_save, callback, onPostModal);
+                        });
+                    });
 
-			function submitModal(form_id) {
-				if (typeof(tinyMCE) != 'undefined') {
-					tinyMCE.triggerSave();
-				}
-				$('form ' + form_id).submit();
-				status = 1;
-			}
+                    /*
+                    changeModalContent(dialog, url_open);
+                    if (! no_confirm) {
+                        handlePostModal(form_id, url_save, callback, onPostModal);
+                    }
+                    */
+                    return dialog;
+                }
 
-			function handlePostModal(form_id, url_save, callback) {
-				$('form ' + form_id).submit(function(e) {
-					e.preventDefault();
-					var formData = new FormData(this);
-					$.ajax({
-						url: url_save,
-						type: 'POST',
-						data: formData,
-						success: function (data) {
-							if (callback) {
-								eval(callback);
-							}
-						},
-						cache: false,
-						contentType: false,
-						processData: false
-					});
-				});
-			}
-		</script>
+                function changeModalContent(dialog, url, callback) {
+                    dialog.init(function() {
+                        $.get(url, function(data) {
+                            dialog.find('.bootbox-body').html(data);
+                        });
+                    });
+                }
+
+                function viewModal(url, size, title) {
+                    var dialog = bootbox.dialog({
+                        title: title ? title : 'Web viewer',
+                        message: '<iframe style="border:0;" src="' + url + '" height="400" width="100%"></iframe>',
+                        size: size ? size : 'xl',
+                        scrollable: true,
+                    });
+                }
+
+                function viewWindow(url, size, title) {
+                    var width = (size == 'sm') ? 400 : 600;
+                    var title  = title ? title : 'Web viewer';
+                    window.open(url, title, "menubar=no, status=no, scrollbars=no, menubar=no, width=" + width + ", height=400");
+                }
+
+                function buildModalButtons(form_id, no_confirm, callback) {
+                    return no_confirm ? '' : {
+                        cancel: {
+                            label: '<i class="fa fa-ban"></i> {{ __("Core.cancel") }}',
+                            className: 'btn-secondary'
+                        },
+                        confirm: {
+                            label: '<i class="fa fa-save"></i> {{ __("Core.save") }}',
+                            className: 'btn-success',
+                            callback: function() {
+                                return submitModal(form_id, callback);
+                            }
+                        },
+                    };
+                }
+
+                function submitModal(form_id, callback) {
+                    if (typeof(tinyMCE) != 'undefined') {
+                        tinyMCE.triggerSave();
+                    }
+                    var $form = $(form_id);
+                    console.log('submitModal ' + form_id);
+                    if ($form.valid()) {
+                        deactivateButton($form);
+                        console.log('check valid');
+                        $form.submit();
+                    }
+                    return false;
+                }
+
+                function handlePostModal(form_id, url_save, callback, onPostModal) {
+                    // console.log('handlePostModal');
+                    // initValidator();
+                    var response = false;
+                    $(form_id).submit(function(e) {
+                        e.preventDefault();
+                        console.log('handlepostmodal submit');
+
+                        if (onPostModal) {
+                            response = eval(onPostModal);
+                        } else {
+                            response = postModal(form_id, url_save, callback);
+                        }
+                        // console.log(response);
+                    });
+                    return response;
+                }
+
+                function postModal(form_id, url_save, callback) {
+                    console.log('postModal');
+                    console.log(form_id);
+                    console.log(callback);
+                    var ret = false;
+                    var $form = $(form_id);
+                    var myForm = document.getElementById(form_id.substring(1));
+
+                    $.ajax({
+                        url: url_save,
+                        type: 'POST',
+                        data: new FormData(myForm),
+                        success: function (data) {
+                            if (callback) {
+                                eval(callback);
+                            }
+                            if (!data.error) {
+                                bootbox.hideAll();
+                            }
+                        },
+                        crossDomain: true,
+                        headers: {
+                            "accept": "application/json",
+                            "Access-Control-Allow-Origin":"*"
+                        },
+                        cache: false,
+                        contentType: false,
+                        processData: false
+                    });
+
+                    return ret;
+                }
+
+                function openWindow(url, target) {
+                    target = (typeof(target) == 'undefined') ? '_blank' : target;
+                    if (target == '_blank') {
+                        var anchor = document.createElement('a');
+                        anchor.href = url;
+                        anchor.target = "_blank";
+                        anchor.click();
+                    } else {
+                        window.location = url;
+                    }
+                }
+
+                function reactivateButton($form) {
+                    console.log('activateButton');
+                    var $button = $form.closest('.modal-content').find('.bootbox-accept').first();
+                    if ($button.attr("disabled")) {
+                        $button.prop("disabled", false);
+                        $button.html("<i class='fa fa-save'></i> {{ __('Core.save') }}");
+                    }
+                }
+
+                function deactivateButton($form) {
+                    console.log('deactivateButton');
+                    console.log($form);
+                    var $button = $form.closest('.modal-content').find('.bootbox-accept').first();
+                    console.log($button);
+                    $button.prop("disabled", true);
+                    $button.html("<i class='fa fa-spinner fa-spin'></i> {{ __('Core.processing') }}");
+                }
+
+            </script>
+        @endcomponent
 	@endpush
 
 	@php(define('LOAD_MODAL', true))
-@endif
\ No newline at end of file
+@endif