Include different objects with same name from libraries with same name.

Question

I am attempting to create a page with feeds from multiple network cameras, but the JS libraries I reference are stored on the cameras themselves with the same name. Also, the video stream viewer objects are named identically.

Here's a sample of the code I have so far:

<script type='text/javascript' src='http://192.168.0.1:80/jsv/SncViewer.js'></script>
<script type="text/javascript">
new SNC.viewer('div1',{sz:'3',atc:'0',at:'1',ptz:'1',fps:'30',mt:'1',iPS:'1',frm:'0'});
</script>
<script type='text/javascript' src='http://192.168.0.2:80/jsv/SncViewer.js'></script>
<script>
new SNC.viewer('div2',{sz:'3',atc:'0',at:'1',ptz:'1',fps:'30',mt:'1',iPS:'1',frm:'0'});
</script>

It displays the first object correctly, but not the second.

Is there a way to create separate instances of this object that come from the different network libraries?

Answer 1

The first step is probably to download the JavaScript from both cameras and examine it. They probably hard-code some data in them but maybe you can create your own version which allows to configure the SNC viewer object at runtime.

If that fails or is too much effort, then put each camera into a new iframe because frames will isolate the scripts from each other.