Jump to the post that solved this thread.
Solved: 1 Year, 8 Months ago Modal gets stuck on bottom when clicked repeatedly
#11
Solved: 1 Year, 8 Months ago
Solved there : https://community.mybb.com/thread-225982.html
Reply
#12
Solved: 1 Year, 8 Months ago
I've tried all of the 3 solutions mentioned above first individually, then all at once, and none of those attempts seemed to have any effect. I can see that the change is there and visible to my browser, though.
Attempted on MyBB 1.8.22, default theme, stock install, PHP 7.3. Tried on Firefox and Chrome, both the latest available version - couldn't spot any significant difference between the experiences on either of them, and while Firefox didn't seem to appreciate the fade animation and started lagging a bit - that's probably just my computer. Currently hosting on my local machine for testing purposes, but if needed, I can set up hosting for it.

Sure is an odd issue, this. Thanks everyone for your help so far! Smile
Reply
#13
Solved: 1 Year, 8 Months ago
(2020-01-08, 10:01 PM)mTurtle_ Wrote: Currently hosting on my local machine for testing purposes, but if needed, I can set up hosting for it.

Hi,

it would be great to see it "live".
I don't answer questions about localhost forums or forums without URL, I'm not a seer.  Cool
Reply
#14
Solved: 1 Year, 8 Months ago
(2020-01-09, 07:57 AM)NoRules Wrote:
(2020-01-08, 10:01 PM)mTurtle_ Wrote: Currently hosting on my local machine for testing purposes, but if needed, I can set up hosting for it.

Hi,

it would be great to see it "live".
No problem Smile You can check here now: https://files.srv1.dev.avantheim.net/mybbtest/index.php
The issue seems to still remain.

I've been doing a bunch of research on this, and it seems like the issue is not with general.js. Rather, it's the modal jquery plugin allowing the user to create more modals while one is still initializing, etc.
That's all speculation though, just figured I'd provide all the info I have.
Reply
#15
Solved: 1 Year, 8 Months ago
Quote:Modal gets stuck on bottom when clicked repeatedly
yes! if the clicks are fast enough then the modal appears at the bottom of the page ..

perhaps multiple clicks should be prevented
[jquery+prevent+multiple+click+events]
Reply
#16
Solved: 1 Year, 8 Months ago
(2020-01-09, 04:08 PM).m. Wrote:
Quote:Modal gets stuck on bottom when clicked repeatedly
yes! if the clicks are fast enough then the modal appears at the bottom of the page ..

perhaps multiple clicks should be prevented
[jquery+prevent+multiple+click+events]
I've come up with a similar solution to that already : ) So.. was it a misunderstanding all along? If it was, I'm sorry for all the trouble  Shy
Reply
#17
Solved: 1 Year, 8 Months ago
The problem is here: https://github.com/mybb/mybb/blob/mybb_1...ns.js#L340

The jQuery modal plugin have an option to delay the show of the box and it does it using setTimeout. But soon after you can see that it adds the event handlers to manage the closure of the modal, this means: I can close the modal before the box is showed.

Fast solution, remove in jscripts/jquery.plugins.js (jscripts/jquery.plugins.min.js needs to be updated too) from the open method:

$(document).off('keydown.modal').on('keydown.modal', function(event) {
  var current = getCurrent();
  if (event.which == 27 && current.options.escapeClose) current.close();
});
if (this.options.clickClose)
  this.$blocker.on('click',function(e) {
    if (e.target==this)
      $.modal.close();
  });

and move it at the end of the show method

show: function() {
  this.$elm.trigger($.modal.BEFORE_OPEN, [this._ctx()]);
  if (this.options.showClose) {
    this.closeButton = $('<a href="#close-modal" rel="modal:close" class="close-modal ' + this.options.closeClass + '">' + this.options.closeText + '</a>');
    this.$elm.append(this.closeButton);
  }
  this.$elm.addClass(this.options.modalClass).appendTo(this.$blocker);
  if(this.options.doFade) {
    this.$elm.css('opacity',0).show().animate({opacity: 1}, this.options.fadeDuration);
  } else {
    this.$elm.show();
  }
  this.$elm.trigger($.modal.OPEN, [this._ctx()]);
  $(document).off('keydown.modal').on('keydown.modal', function(event) {
    var current = getCurrent();
    if (event.which == 27 && current.options.escapeClose) current.close();
  });
  if (this.options.clickClose)
    this.$blocker.on('click',function(e) {
      if (e.target==this)
        $.modal.close();
    });
},
Reply
#18
Solved: 1 Year, 8 Months ago
(2020-01-10, 10:18 PM)Mipher Wrote: The problem is here: https://github.com/mybb/mybb/blob/mybb_1...ns.js#L340

The jQuery modal plugin have an option to delay the show of the box and it does it using setTimeout. But soon after you can see that it adds the event handlers to manage the closure of the modal, this means: I can close the modal before the box is showed.

Fast solution, remove in jscripts/jquery.plugins.js (jscripts/jquery.plugins.min.js needs to be updated too) from the open method:

$(document).off('keydown.modal').on('keydown.modal', function(event) {
  var current = getCurrent();
  if (event.which == 27 && current.options.escapeClose) current.close();
});
if (this.options.clickClose)
  this.$blocker.on('click',function(e) {
    if (e.target==this)
      $.modal.close();
  });

and move it at the end of the show method

show: function() {
  this.$elm.trigger($.modal.BEFORE_OPEN, [this._ctx()]);
  if (this.options.showClose) {
    this.closeButton = $('<a href="#close-modal" rel="modal:close" class="close-modal ' + this.options.closeClass + '">' + this.options.closeText + '</a>');
    this.$elm.append(this.closeButton);
  }
  this.$elm.addClass(this.options.modalClass).appendTo(this.$blocker);
  if(this.options.doFade) {
    this.$elm.css('opacity',0).show().animate({opacity: 1}, this.options.fadeDuration);
  } else {
    this.$elm.show();
  }
  this.$elm.trigger($.modal.OPEN, [this._ctx()]);
  $(document).off('keydown.modal').on('keydown.modal', function(event) {
    var current = getCurrent();
    if (event.which == 27 && current.options.escapeClose) current.close();
  });
  if (this.options.clickClose)
    this.$blocker.on('click',function(e) {
      if (e.target==this)
        $.modal.close();
    });
},
Worked like a charm! Thank you very much. : )
Reply
Jump to the post that solved this thread.


Forum Jump:


Users browsing this thread: 1 Guest(s)