Using lhc online status with JS to change <div> content

RichardO · 2017-11-29 15:31:53

Hi

I'm not referring to customisation within lhc.

On www.donbur.co.uk, I use lhc and have been for some time - It's great!!

In the footer (right side) of our new page design *** http://www.donbur.co.uk/test I have a section with a graphic that I would like to change depending on whether someone is online or not.

The widget does this, but is there a javascript method to detect online status and change the content of a div?

For instance, I could have

[== HTML ==]
<div id="lhcstatusgraphic"></div>

Then a piece of js to put "online" or "offline" into the div.

I'm sure this is possible but I'm not sure how to go about it.

Any help would be appreciated.

Thanks, Richard

Last edited by RichardO (2017-11-29 15:33:04)

PeopleInside · 2017-11-29 15:53:25

Hi RichardO ,
welcome back on the forum!

Please try to read the documentation.
I hope the below link can help you.

https://livehelperchat.com/documentation-6c.html
https://livehelperchat.com/how-to-chang … -332a.html
https://livehelperchat.com/article/view/59
https://livehelperchat.com/i-m-planning … -262a.html

RichardO · 2017-11-29 15:58:21

PeopleInside wrote:

Hi RichardO ,
welcome back on the forum!
Please try to read the documentation.
I hope the below link can help you.
https://livehelperchat.com/documentation-6c.html
https://livehelperchat.com/how-to-chang … -332a.html
https://livehelperchat.com/article/view/59
https://livehelperchat.com/i-m-planning … -262a.html

Thank you for these links.

Unfortunately, most of these are very general links to various help topics but it doesn't answer my question.

If you read the question, you'll see I'm not trying to alter templates or modify lhc in any way. I simply want to detect if lhc users are online or offline.

PeopleInside · 2017-11-29 18:08:10

Sorry,
I cannot help more with that.

You can find some suggestions here:
https://forum.livehelperchat.com/viewtopic.php?id=2255

remdex · 2017-11-29 18:15:17

What you should is see what html elements lhc renders and add CSS to your stylesheet smile

RichardO · 2017-11-30 08:55:11

remdex wrote:

What you should is see what html elements lhc renders and add CSS to your stylesheet

Thanks Remdex.

Not a bad idea although I want to add additional content rather than changing existing css. I'll look at element.cloneNode() to see if I can copy/append the html elements and add alternative css.

Thanks for trying.

Kind regards

Richard

RichardO · 2017-11-30 09:55:59

This works so I'm implementing now...

[== Undefined ==]
<span class="lhc-text-status">Offline</span>

<div id="lhcStatusDuplicate"></div>

<script>

    var lhcStatus = document.getElementsByClassName("lhc-text-status");
    var lhcStatusClone = lhcStatus[0].cloneNode(true);
	document.getElementById("lhcStatusDuplicate").appendChild(lhcStatusClone);

</script>

lhc renders a span with the class "lhc-text-status" which is either Offline or Online - great starting point.

The javascript above takes that content and duplicates into the div with id "lhcStatusDuplicate", which I can use .

Thought I'd post to help anyone else asking.

Thanks

Richard

_____________

*edit* - no it doesn't work - I'm getting an "Uncaught TypeError: Cannot read property 'cloneNode' of undefined..." shame...

Last edited by RichardO (2017-11-30 10:02:53)

remdex · 2017-11-30 16:09:02

You can use one of the callbacks to lhc object then status widget is rendered.
https://livehelperchat.com/integration- … -273a.html

See in this URL for
show_widget_cb

RichardO · 2017-11-30 16:13:41

remdex wrote:

You can use one of the callbacks to lhc object then status widget is rendered.
https://livehelperchat.com/integration- … -273a.html
See in this URL for
show_widget_cb

Great!! Thank you.

PeopleInside · 2017-12-04 16:00:50

smile

Announcement

#1 2017-11-29 15:31:53

Using lhc online status with JS to change <div> content

#2 2017-11-29 15:53:25

Re: Using lhc online status with JS to change <div> content

#3 2017-11-29 15:58:21

Re: Using lhc online status with JS to change <div> content

#4 2017-11-29 18:08:10

Re: Using lhc online status with JS to change <div> content

#5 2017-11-29 18:15:17

Re: Using lhc online status with JS to change <div> content

#6 2017-11-30 08:55:11

Re: Using lhc online status with JS to change <div> content

#7 2017-11-30 09:55:59

Re: Using lhc online status with JS to change <div> content

#8 2017-11-30 16:09:02

Re: Using lhc online status with JS to change <div> content

#9 2017-11-30 16:13:41

Re: Using lhc online status with JS to change <div> content

#10 2017-12-04 16:00:50

Re: Using lhc online status with JS to change <div> content

Board footer