Disappearing Edit/Delete Icons In Comment Boxes (again)

Strumelia
@strumelia
4 years ago
3,603 posts

As per this old thread, this issue was fixed up in the Comments module a long time ago:
https://www.jamroom.net/the-jamroom-network/forum/my_posts/39090/disappearing-edit-and-delete-icons-in-comment-boxes/search_string=comment+delete+old+module
However, i thought I'd mention that it's still happening to me. Not sure if it still happens to @lornawebber as well.
It's not a huge problem, but can be a bit annoying to have to put your cursor off to the side and then refresh the page to get the icons back again. Hoping maybe it's a simple fix to apply again.

--
...just another satisfied Jamroom customer.
Migrated from Ning to Jamroom June 2015
updated by @strumelia: 12/10/20 06:48:28PM

@michael
4 years ago
7,746 posts

I know what this is, your skin may need a tweak. Send us an email to support at jamroom dot net along with the logins to your site and a url to where you see it happening and I'll get it fixed up.

The issue was that the code was something like "on hover then toggle" from invisible to visible. which is fine if your cursor is off the page when the page is refreshed.

The issue arises when your cursor is over the buttons when the page is refreshed. in that case the toggle causes the opposite and hides it when you want to click.

Strumelia
@strumelia
4 years ago
3,603 posts

I'll send an email with my login. Unfortunately, I can't seem to make this happen by trying the refresh while leaving the cursor over the buttons. And it seems to happen randomly so I'd have to wait til it happens again in order to send you an url. However, I do notice that it seems to happen to me most when I'm trying to edit a post- either in Forums or Group discussions, or both. But that might simply be when I notice it most, since it stops me from doing things.
Thanks for looking into this! Note- I'd have to tweak the skin on both my sites, not just on fotmd.com.

--
...just another satisfied Jamroom customer.
Migrated from Ning to Jamroom June 2015

@michael
4 years ago
7,746 posts

it is what I thought it was, the code on the buttons looks like this:

$(function () {
    $('#p{$item._item_id}').hover(function () {
	$('#m{$item._item_id}').fadeToggle('fast');
    });
});

But needs changing to this type of structure

$(function() {
    var mid = $('#m{$item._item_id}');
    $('#p{$item._item_id}').hover(function() {
		mid.fadeIn('fast');
	    }, function() {
		mid.fadeOut('fast');
	    }
    );
});

The first one reads: when the cursor hovers over this block toggle its visibility. But since its showing toggling it means hiding it.

That needs changing to: when the cursor is over this block show it, otherwise hide it.

Still need to locate where that code is in your site so its not fixed yet.

@michael
4 years ago
7,746 posts

For you on your site the cause of the issue was a module override at:
ACP -> ITEM FEATURES -> TEMPLATES -> item_list.tpl -> MODIFY

Because an over-ridden version of the modules code was being used, the update that got put in place to fix the issue was not applied to the modified template.

I've added the modules code into the modified template so it does work now.

The code on line 62 was:

<script>$(function () { $('#cm{$item._item_id}').hover(function() { $('#bc{$item._item_id}').toggle(); }); });</script>

its now

<script>$(function() { var bc = $('#bc{$item._item_id}'); $('#cm{$item._item_id}').hover(function() { bc.show(); }, function() { bc.hide(); } ); }); </script>

Should be good to go now.

Strumelia
@strumelia
4 years ago
3,603 posts

Yes, I just inspected code (in chrome) in a random page post of a forum discussion just now, and I find:

$(function() { var bc = $('#bc170226'); $('#cm170226').hover(function() { bc.show(); }, function() { bc.hide(); } ); });

:D
Of course, i had to know what i was looking for and find it via a code search, because i couldn't do it the quick way by hovering over the element in the Inspect window to locate the code, without it toggle/disappearing when i tried to hover over the element... (oh the irony!) But after locating it I see how the code is changed in the way you describe, to change its behavior. I understand what I'm seeing but lack the skills to write/fix that code.
So, i thank you for explaining all this so clearly to me- i do grasp the concepts and I really appreciate you taking the time to show exactly what you did, Michael. And I saw where you also fixed it up on my pennywhistle site template in the Comment module.

So, one last question just so i get this clear in my head:
this modified template- i see the changed code in the jrComments MODULE... so it was a module template override causing the problem. But because my custom skin does NOT have a "jrComment_... " template at all, then that means there was no override code that needed fixing in my custom SKIN in this case... only in my Comment module. Is this correct?

--
...just another satisfied Jamroom customer.
Migrated from Ning to Jamroom June 2015
updated by @strumelia: 09/08/20 09:39:00AM

@michael
4 years ago
7,746 posts

Correct.

The order of over-rides from memory goes:
* (template, say ) item_list.tpl
* if there is a change at ACP -> MODULE NAME -> TEMPLATES -> item_list.tpl ->MODIFY ( this over-rides the above )
* if there is a template copied from /modules/(module name)/templates/item_list.tpl to /skins/(your skin)/jrModuleName_item_list.tpl ( this over-rides anything above )
* if there is a change at ACP -> SKINS -> TEMPLATES -> jrModuleName_item_list.tpl -> MODIFY ( this over-rides anything above )

So if I was building the site you'd find all of the changes in the files at /skins/(here) and I would never use the ACP for changes. But its a choice. If I was not setup for development the the ACP changes are quicker and you can use the compare to compare it against newer changes, but it means there's more places to check when you want to make a change.

In those cases I'd use the "WHERE IS THIS DDDDDDDDDDDDDD" technique. make a change and see if it comes out where I think it should. If it does, im editing the right template.