0
Not a bug

AC_VHost_Embed distroys entire DOM when called

Sashi 3 years ago in SitePal Gold updated by Gil Sideman 3 years ago 5

I am using Angular 11.   I have a <DIV> with a "onclick" event handler, which calls AC_VHost_Embed()".   When the div is clicked on, the Avatar appears, but ALL THE DOM elements (previoiusly rendered) are removed.   

Answer

Answer

Sashi - 

Our support team should have gotten back to you with a solution and code example.

I hope the issue is clarified and resolved.


Best,

Gil

ps. The same code example and documentation will be made available on our support page in the next few days.

Under review

Hi Sashi, 

let me check with my team and get back to you.

It would be helpful if you could post a link to your page where the problem can be seen.

Regards,

Gil

The SitePal Team

Answer

Sashi - 

Our support team should have gotten back to you with a solution and code example.

I hope the issue is clarified and resolved.


Best,

Gil

ps. The same code example and documentation will be made available on our support page in the next few days.

Gil,

I just started to evaluate SitePal, so the code is on my development machine at home.   But basically here is the problem:

In Angular, the main index.html file DOES NOT CONTAIN ANY CONTENT, so I cannot place the <script>AC_VHost_Embed() ... </script> code there.   (I CAN, and everything works, but the avatar just appears at the bottom of all the dynamic content).

So my attempt was to place the <script>AC_VHost_Embed() ... </script> code inside an Angular component.   This however CANNOT BE DONE DIRECTLY, because angular does not allow <script> tags in component templates.   

There is a well known trick to overcome this, is by dynamically generate the script content:    So inside the component's ngOnInit() function:


let div = this.document.getElementById('sitepal-face'); 

let script = this.renderer.createElement('script'); 

script.type = 'text/javascript'; 

script.text = 'AC_VHost_Embed(xxxxxx,300,400,"",1,0, 2722993, 0,1,0,"a81aeeadcc25ae0ec25d723653006161",0);'; this.renderer.appendChild(div, script);

When I do this, the <script> tag DOES APPEAR in the DOM, but I get an error:

core.js:6142 ERROR TypeError: Cannot read property 'style' of null
        at vhsshtml5_load2D3DHTMLContent (sitepalPlayer_v1.js:1)

My thought was that somehow the order of loading is wrong, so to delay the loading of the avatar, I added an "onclick" handler to the <div> elelment (with the id of "sitepal-face").   So the avatar would only load when the div was clicked.

This DOES WORK, except when the avatar is loaded, ALL OTHER DOM elements on the page are removed.

Noted. Thanks for sharing this, I'll consult and get back to you.