diff options
Diffstat (limited to 'assets/js/display.js')
-rw-r--r-- | assets/js/display.js | 191 |
1 files changed, 102 insertions, 89 deletions
diff --git a/assets/js/display.js b/assets/js/display.js index 10719811..cf1a23dd 100644 --- a/assets/js/display.js +++ b/assets/js/display.js @@ -1,93 +1,106 @@ -$(document).ready(function () { - - /* init some needed tags and values */ - - $('table#data').wrap('<div id="fkcontainer" class="fk" />'); - $('#fkcontainer').append('<div id="root" />'); - - jQuery.ppa = { - root: $('#root') - }; - - $("a.fk").on('click', function (event) { - /* make the cursor being a waiting cursor */ - $('body').css('cursor', 'wait'); - - query = $.ajax({ - type: 'GET', - dataType: 'html', - data: { - action: 'dobrowsefk' - }, - url: $(this).attr('href'), - cache: false, - context: $(this), - contentType: 'application/x-www-form-urlencoded', - success: function (answer) { - pdiv = this.closest('div.fk'); - divclass = this.attr('class').split(' ')[1]; - - /* if we are clicking on a FK from the original table +$(function () { + /* init some needed tags and values */ + + $('table#data').wrap('<div id="fkcontainer" class="fk" />'); + $('#fkcontainer').append('<div id="root" />'); + + jQuery.ppa = jQuery.ppa || { + root: $('#root'), + }; + + $('a.fk').on('click', function (event) { + /* make the cursor being a waiting cursor */ + $('body').css('cursor', 'wait'); + let $this = $(this); + $.ajax({ + type: 'GET', + dataType: 'html', + data: { + action: 'dobrowsefk', + }, + url: String($(this).attr('href')), + cache: false, + context: $(this), + contentType: 'application/x-www-form-urlencoded', + }) + .done((answer) => { + let pdiv = $this.closest('div.fk'), + divclass = $this.attr('class').split(' ')[1]; + + /* if we are clicking on a FK from the original table (level 0), we are using the #root div as parent-div */ - if (pdiv[0].id == 'fkcontainer') { - /* computing top position, which is the topid as well */ - var top = this.position().top + 2 + this.height(); - /* if the requested top position is different than + if (pdiv[0].id == 'fkcontainer') { + /* computing top position, which is the topid as well */ + var top = $this.position().top + 2 + $this.height(); + /* if the requested top position is different than the previous topid position of #root, empty and position it */ - if (top != jQuery.ppa.root.topid) - jQuery.ppa.root.empty() - .css({ - left: (pdiv.position().left) + 'px', - top: top + 'px' - }) - /* this "topid" allows to track if we are + if (top != jQuery.ppa.root.topid) { + /* this "topid" allows to track if we are opening a FK from the same line in the original table */ - .topid = top; - - pdiv = jQuery.ppa.root; - - /* Remove equal rows in the root div */ - jQuery.ppa.root.children('.' + divclass).remove(); - } else { - /* Remove equal rows in the pdiv */ - pdiv.children('div.' + divclass).remove(); - } - - /* creating the data div */ - newdiv = $('<div class="fk ' + divclass + '">').html(answer); - - /* highlight referencing fields */ - newdiv.data('ref', this).data('refclass', $(this).attr('class').split(' ')[1]) - .mouseenter(function (event) { - $(this).data('ref').closest('tr').find('a.' + $(this).data('refclass')).closest('div').addClass('highlight'); - }) - .mouseleave(function (event) { - $(this).data('ref').closest('tr').find('a.' + $(this).data('refclass')).closest('div').removeClass('highlight'); - }); - - /* appending it to the level-1 div */ - pdiv.append(newdiv); - - newdiv.on('click', '.fk_delete', function (event) { - console.log('clicked .fk_delete', jQuery(this)); - with($(this).closest('div')) { - data('ref').closest('tr').find('a.' + data('refclass')).closest('div').removeClass('highlight'); - remove(); - } - }); - }, - - error: function () { - this.closest('div.fk').append('<p class="errmsg">' + Display.errmsg + '</p>'); - }, - - complete: function () { - $('body').css('cursor', 'auto'); - } + jQuery.ppa.root.empty().css({ + left: pdiv.position().left + 'px', + top: top + 'px', + }).topid = top; + } + + pdiv = jQuery.ppa.root; + + /* Remove equal rows in the root div */ + jQuery.ppa.root.children('.' + divclass).remove(); + } else { + /* Remove equal rows in the pdiv */ + pdiv.children('div.' + divclass).remove(); + } + + /* creating the data div */ + let newdiv = $('<div class="fk ' + divclass + '">').html(answer); + + /* highlight referencing fields */ + newdiv + .data('ref', $this) + .data('refclass', $(this).attr('class').split(' ')[1]); + newdiv + .on('mouseenter', function (event) { + $(this) + .data('ref') + .closest('tr') + .find('a.' + $(this).data('refclass')) + .closest('div') + .addClass('highlight'); + }) + .on('mouseleave', function (event) { + $(this) + .data('ref') + .closest('tr') + .find('a.' + $(this).data('refclass')) + .closest('div') + .removeClass('highlight'); + }); + + /* appending it to the level-1 div */ + pdiv.append(newdiv); + + newdiv.on('click', '.fk_delete', function (event) { + console.log('clicked .fk_delete', jQuery(this)); + let closestDiv = $(this).closest('div'); + closestDiv + .data('ref') + .closest('tr') + .find('a.' + closestDiv.data('refclass')) + .closest('div') + .removeClass('highlight'); + closestDiv.remove(); }); - - return false; // do not refresh the page - }); - - -});
\ No newline at end of file + }) + .fail((err) => { + $this + .closest('div.fk') + .append('<p class="errmsg">' + Display.errmsg + '</p>'); + }) + .always(() => { + $('body').css('cursor', 'auto'); + }); + + return false; // do not refresh the page + }); +}); |