[client] Highlight linked comments to identify them

[BBaoVanC]

Fixes #838

TODO:

• Figure out the best way to do styling
• Docs
• Tests (check that .isso-target gets applied properly)

[BBaoVanC]

@ix5 Can you take a look at this please?

I have CSS added to set a background color included. I don't think that separating it out like what we did in #844 makes sense because this feature should be included by default. It's also different since it doesn't require any configuration by the site owner to function.

Also, I did figure out how to get it not to conflict with #844. By not setting the 100% keyframe, it automatically just fades out to whatever background color is the fallback for the element.

Let me know if there's a better place for the hashchange event listener, and if window.addEventListener is the right function to use for it; I wasn't really sure what to do with it.

[ix5]

Hey @BBaoVanC, I'm off to a well-deserved break, starting tomorrow. So I won't be able to review your changes for about a week.

Let's do a deal: You figure out a solution and submit draft PRs to at least some of these open issues which I think you're more than capable of solving:

• Make name/URL/e-mail editable #111
• Counter problem #448
• Bugs with indented code #465
• [client] Clean up and standardize client CSS #859
• Race conditions / re-arranging parts in [client] js: Fetch public conf once from /config; embed.js: Preserve default config values #821 and [client] fetchComments is adding another PostBox even if there is already one displayed #842

... and I'll be happy to take some time to review this highlighting PR once I get back ;-)

Would also be nice if at some of these low hanging fruits could be fixed:

• Log out of admin interface #552
• Isso always calls count even if not needed #771

[BBaoVanC]

Hey @BBaoVanC, I'm off to a well-deserved break, starting tomorrow. So I won't be able to review your changes for about a week.

Let's do a deal: You figure out a solution and submit draft PRs to at least some of these open issues which I think you're more than capable of solving:

* [Make name/URL/e-mail editable #111](https://github.com/posativ/isso/issues/111)

* [Counter problem #448](https://github.com/posativ/isso/issues/448)

* [Bugs with indented code #465](https://github.com/posativ/isso/issues/465)

* [[client] Clean up and standardize client CSS #859](https://github.com/posativ/isso/issues/859)

* Race conditions / re-arranging parts in [[client] js: Fetch public conf once from /config; embed.js: Preserve default config values #821](https://github.com/posativ/isso/pull/821) and [[client] `fetchComments` is adding another PostBox even if there is already one displayed #842](https://github.com/posativ/isso/issues/842)

... and I'll be happy to take some time to review this highlighting PR once I get back ;-)

Would also be nice if at some of these low hanging fruits could be fixed:

* [Log out of admin interface #552](https://github.com/posativ/isso/issues/552)

* [Isso always calls count even if not needed #771](https://github.com/posativ/isso/issues/771)

I'll take a look at those. Hope you have a nice break!

[ix5]

I have CSS added to set a background color included. I don't think that separating it out like what we did in #844 makes sense because this feature should be included by default. It's also different since it doesn't require any configuration by the site owner to function.

That's fine. As commented inline, the yellow is a bit jarring at night, but yellow is universally accepted as a marker/highlight/attention color. Maybe once there's a dark mode someone can style it differently. Keep as-is for now.

Let me know if there's a better place for the hashchange event listener, and if window.addEventListener is the right function to use for it; I wasn't really sure what to do with it.

I'm not qualified to comment on event listeners, my JS knowledge is pretty bad. I found this SO answer which seems to suggest a similar thing. Availability of Caniuse: hashchange seems good.

As for stuffing this piece of code into init(): IMO that file is already quite overloaded. Maybe shoving everything related to timers and events into a separate file (that can be stubbed/mocked) would simplify testing a good bit.

Several places rely on window.location.*. Unifying that would be a nice first step.
E.g. this is just a stupid duplication:
https://github.com/posativ/isso/blob/fdcadaddcd87fe97fbd7ca328a2ef7ea56eccb87/isso/js/app/api.js#L7
https://github.com/posativ/isso/blob/fdcadaddcd87fe97fbd7ca328a2ef7ea56eccb87/isso/js/embed.js#L74

[ix5]

Would you mind adding a small styling guide to the docs? (Perhaps under "Tips & Tricks", 1-2 lines should be enough).

Code-wise, this looks good right now.

[BBaoVanC]

Would you mind adding a small styling guide to the docs? (Perhaps under "Tips & Tricks", 1-2 lines should be enough).

Code-wise, this looks good right now.

I added some docs, now all that's left is a small test if possible which just makes sure that .isso-target gets applied when going to like #isso-1 for example.

[ix5]

Added some tests. Thank you and looking forward to reviewing other great contributions!