Skip to main content
5-Regular Member
November 4, 2022
Solved

Create Custom Widget to switch on the camera

  • November 4, 2022
  • 1 reply
  • 914 views

I have a requirement to switch on a camera from browser of ipad to click a image and store it in system. For this I am trying to build a custom widget. 

 

For this I have created a "CameraON" boolean property in camera.ide.js file. From camera.runtime.js file I am checking for this property, if it is true I am trying to switch on the camera. But it is not working. I am attaching both the files for reference. 

 

It would be helpful if someone can help on this or suggest how to troubleshoot.

Thanks in advance!

Best answer by VladimirRosu_116627

Hi @JS_10369742,,

 

Some of our colleagues from presales created an example VideoPlayer widget here https://github.com/ptc-iot-sharing/HtmlVideoPlayerWidgetTWX/blob/master/ui/HTML5Video/HTML5Video.runtime.js

You can see there the way they render their content in runtime. Before you package your code as a widget, I suggest testing it in a simple HTML page to see if the principle works well.

The things I observed in your code are the following:

  1. in the afterRender function you just assign a boolean checkbox to the span you rendered in renderHtml. This function will execute only once. Meaning it will not react to runtime behaviors.
  2. the proper way to do this is to set the span in the updateProperty function - as you did already, but in the same code path in this function you should also enable/disable the camera. As I see now you added an if that is going to be executed only once when the runtime loads this function (I believe even pre-render).

1 reply

19-Tanzanite
November 9, 2022

Hi @JS_10369742,,

 

Some of our colleagues from presales created an example VideoPlayer widget here https://github.com/ptc-iot-sharing/HtmlVideoPlayerWidgetTWX/blob/master/ui/HTML5Video/HTML5Video.runtime.js

You can see there the way they render their content in runtime. Before you package your code as a widget, I suggest testing it in a simple HTML page to see if the principle works well.

The things I observed in your code are the following:

  1. in the afterRender function you just assign a boolean checkbox to the span you rendered in renderHtml. This function will execute only once. Meaning it will not react to runtime behaviors.
  2. the proper way to do this is to set the span in the updateProperty function - as you did already, but in the same code path in this function you should also enable/disable the camera. As I see now you added an if that is going to be executed only once when the runtime loads this function (I believe even pre-render).