Hi,
I am writing an application for Gear S2 watch (Tizen 2.3.2.1)
It will display Jpg image from a live camera. I use the following code for displayig the image and then refresh every 10 seconds.
urls[2]="http://192.168.0.5/snapshot.cgi?user=user&pwd=pass";
if (urls[2].length!==0){ imgs[2].src = urls[2];}
if (imgs[2]) { context.drawImage(imgs[2],134,134,92,76);
However, the image does not change at every refresh.
Then I thought that the image might be cached as described here:
https://stackoverflow.com/questions/1077041/refresh-image-with-a-new-one-at-the-same-url
So I changed my code to :
var t1=new Date().getTime().toString();
var t2=t1.substr(8,5);
urls[2]="http://192.168.0.5/snapshot.cgi?user=user&pwd=pass&c="+t2;
if (urls[2].length!==0){ imgs[2].src = urls[2];}
if (imgs[2]) { context.drawImage(imgs[2],134,134,92,76);
This makes the URL change everytime. But the image is not shown at all now.
Any idea why ?
Then I decided to try another method:
var t1=new Date().getTime().toString(); var t2=t1.substr(8,5); urls[2]="http://192.168.0.5/snapshot.cgi?user=user&pwd=pass&c="+t2;
document.getElementById("cam2").innerHTML = '<img src="'+urls[2]+'" width=92 height=76>';
Now it works and changes every period. However, now the image is replaced loading. so it first turns black and then loads slowly.
How can I preload the image and then display ?
Is there a better method ?