Populate ViewBox with value of a single textbox

[gregincolumbus]

This should be easy but I am not having much luck. I want to grab a URL value from a textbox and then populate the View Box with that data. That is the ONLY field ('VideoURL') in the View Box

//Grab URL from textbox
var vURL = {dialog.Object}.getValue('VideoURL');

//Get Pointer to VB
var vbObj = {dialog.object}.getControl('VID');

//This is hard coded with the URL. How to I pass in vURL formatted like below?
var _d = [
{VideoURL: 'https://www.alphasoftware.com/permanent/builtinvids/big_buck_bunny.mp4'}
]
vbObj.populate(_d);

Thanks in advance for any assistance.

[cptutrecht]

What goes wrong?
Think your code is good, perhaps your viewbox definition not.
See my quick example in the attachment how I defined the source for the viewbox en it's layout
And I changed your video so that it reallly played something

It works stand alone (all hard coded) just press the populate button in preview

[gregincolumbus]

Thank you for your help. The viewbox works fine if hard coded. What I need to do is NOT hardcode the value....but grab the URL from a textbox field and format it as JSON so I can populate the viewbox from that.

[cptutrecht]

Ah,

Try:

var _d = A5.ajax.buildURLParam('VideoURL',vURL);

[gregincolumbus]

Thank you again for the suggestion.


Unfortunately that did not give me the result I need.

I have tried this:

var _d = '[{VideoURL: ' + "'" + vURL + "'" + '}]'

That results in _d =

[{VideoURL: 'https://www.alphasoftware.com/permanent/builtinvids/big_buck_bunny.mp4'}]

Which I think is the same as the hard coded of:

var _d = [
{VideoURL: 'https://www.alphasoftware.com/permanent/builtinvids/big_buck_bunny.mp4'}
]

But the viewbox still fails to load the video.

I must still be missing something. The opening and closing brackets are on different lines in the hard coded...but it looks like the JSON should work?

[peteconway]

Watch the Video - the component is attached.

https://www.screencast.com/t/YpvWkQLtCVNT

[gregincolumbus]

Pete,

Thank you so much for taking the time to make the video and the demo component. Your solution is clean and easy to understand. I am still a novice when it comes to the View Box but I am definitely enjoying the process of learning how to use it.. Thank you again for sharing your expertise on the subject!

Cheers

[peteconway]

Same to Ger.. well done.

[gregincolumbus]

Yes.....thank you so much Ger! I did not know your name before.

I appreciate your willingness to help on this. It is developers like you and Pete who really give back to the developer community and help all of us to be come better developers.

I hope you have a nice weekend....cheers!

[cptutrecht]

your are welcome, succes!
Community is invaluable, got and get many times help here myself!

[Tbrondolo]

Just want to say thanks to both of you. I also was looking at the viewbox for the video container but was stuck on how to pass data to the script in the view box.

Greg, I'm also using S3 as storage for the videos and I'm a bit stuck on access control. Have you tried anything with the access control lists in S3?

Thanks
Tom

[gregincolumbus]

Hi Tom. The help that I received from Ger and Pete allowed me to offer a virtual music adjudication for our music association. We had over 7,000 videos uploaded to s3. The viewbox was the perfect option for the job since it was very light and responsive. We consumed over 8 TBs of bandwidth but overall the approach worked well.

Our music judges used a list control to access the videos. Their access was controlled by an argument......Judge 1 would only see performers assigned to them, etc. I locked out (sort of) the ability to download the video with some code in the viewbox. I will look that up and post it here for you. Are those the questions you had about access control? Obviously there is no easy way to prevent someone from using a screen recorder program to capture the video....but this approach works well for the casual user.

[gregincolumbus]

Here is the layout I used for the viewbox. It turns off the contextual menu and hides the download option. Big caveat, it may not disable those in all browsers....but it is better than nothing.

<div>
<style>
video {
width: 100%;
height: auto;
}
</style>

<video oncontextmenu="return false;" controls controlsList="nodownload" src={VideoURL}></video>
</div>

[peteconway]

Wonderful to read the story Greg, glad it worked well the Viewbox is a real less is more story, less resource consumption, more speed and happy users. - thanks.