CMS Development

jakobtiebel
Member

Show loading splash screen until hs chat is visible

SOLVE

Hi folks,

 

I want to embed hs-chat on a single page for support reason. So far so good: https://docbox.ch/chat.html

 

But due to documented performance issues the chat window needs up to 5 sec until its visible (loaded).

 

Is it possible to show a loading splash screen until the chat window is visible?

 

I tried to use

$(window).load(function() {});

 as indicator for the loading but it does not detect the chat.

 

Please advise.

 

0 Upvotes
1 Accepted solution
Kevin-C
Solution
Recognized Expert | Partner
Recognized Expert | Partner

Show loading splash screen until hs chat is visible

SOLVE

Thanks @dennisedson 

This is a fun one!

 

Hey @jakobtiebel 

 

You can check against window.hubspot_live_messages_running using a recursive function:

 

function doStuff() {
  if(!window.hubspot_live_messages_running) {// Check if it's true
    console.log('not yet');
    setTimeout(doStuff, 50);//Wait 50 millisecnds then recheck
    return;
  }
  console.log("It's ready!");//Do stuff
}
doStuff();

 

 I think there might event be an event you can listen for but I haven't had time to dig through the docs

Kevin Cornett - Sr. Solutions Architect @ BridgeRev

View solution in original post

3 Replies 3
Kevin-C
Solution
Recognized Expert | Partner
Recognized Expert | Partner

Show loading splash screen until hs chat is visible

SOLVE

Thanks @dennisedson 

This is a fun one!

 

Hey @jakobtiebel 

 

You can check against window.hubspot_live_messages_running using a recursive function:

 

function doStuff() {
  if(!window.hubspot_live_messages_running) {// Check if it's true
    console.log('not yet');
    setTimeout(doStuff, 50);//Wait 50 millisecnds then recheck
    return;
  }
  console.log("It's ready!");//Do stuff
}
doStuff();

 

 I think there might event be an event you can listen for but I haven't had time to dig through the docs

Kevin Cornett - Sr. Solutions Architect @ BridgeRev
jonchim
Guide | Diamond Partner
Guide | Diamond Partner

Show loading splash screen until hs chat is visible

SOLVE

Hey @jakobtiebel,

Can you give this a shot and see if that works? you may just need to set a longer delay on your splash screen

$(window).on('load', function()

 






Jon Chim
VP of Design & Development
Hypha HubSpot Development


check Did my post help answer your query? Help the Community by marking it as a solution
dennisedson
HubSpot Product Team
HubSpot Product Team

Show loading splash screen until hs chat is visible

SOLVE

@Kevin-C , any advice?