Stream pdf or image using tokbox api - opentok

I want to stream pdf, ppt, image file from publisher to all subscriber using tokbox api. Is it possible to do that ?
if any one know about it please share your knowledge .
Thanks

Another option is if you can get the pdf, ppt or image onto an HTML Canvas then you can stream a Canvas into an OpenTok Session.
https://github.com/opentok/opentok-web-samples/tree/master/Publish-Canvas
This is easy to do with an image, you can use the drawImage() method.
It looks like it's also possible to do with a PDF with pdf.js:
How to load Pdf file on Canvas as a image.src?

You can use screensharing:
https://tokbox.com/developer/guides/screen-sharing/js/
It allows you to share a whole screen, or just an application window.

Related

Is there any way to make sure that an image is not taken from google but instead the user's phone camera?

I want to only allow images that are taken directly with the phone’s camera on my website. Are there any APIs or tricks that could help me tell if an image is authentic and taken with an iPhone or Android camera a few moments ago and not taken from Google Images.
Hi drstuggels they are a few ways to go about this.
WebRTC
To prevent upload from any file, take picture directly on your web interface, via the user webcam.
You would need to
Ask permission to the user to use the webcam.
Open the video stream
Capture on click the frame
Save the frame
This would prevent lambda users from uploading picture "not live".
If this is a solution you are considering, look for WebRTC. Although there are many blog post showcasing demo for this exact use case.
Such as:
https://developer.mozilla.org/en-US/docs/Web/API/WebRTC_API/Taking_still_photos
EXIF validation
As mentioned by iѕєρєня, you could try to access the EXIF metadata of the uploaded picture and run a validation mechanism, for let say freshness but looking for date and time field (if you are looking for a newly taken photo) or the camera model field to make sure it was taken by a camera (phone, DSLR, etc..).
DISCLAIMER:
Nothing will prevent a malicious user from tampering with the js code or file to upload fake picture.

How can I change the text and image urls in a figma design using the figma API?

I want to be able to dynamically change the text and images in a figma design file, preferably using a JSON to contain the text/image urls. Is this possible with figma api or the figma file?
With the API you can't. There are only GET endpoints to nodes and files
Maybe you can do it with the plugin infrastructure.

Video streaming with HTML5 video player

I'm trying to get into how the video streaming with HTML5 video player works and have some questions about that.
I have such a declaration at my HTML page
<video controls class="card-img-top">
<source src="/stream/video.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
The URL /stream/video.mp4 is handled by the Spring Boot controller which sends the data. All works fine but how I see it very inefficient.
Every time I move the slider on the video timeline to any point I see the requests with Range header like
Range: bytes=88375296-
Range: bytes=39354368-
Range: bytes=60915712-
That's mean at every video scroll I have to provide all the data from a specified point to the end of the video file. That looks really inefficient.
Is there some way to configure HTML5 player to work in more efficient way? Also, could you recommend something to read about video streaming implementation with Spring Boot?
That's mean at every video scroll I have to provide all the data from a specified point to the end of the video file.
The browsers requests all the data form the specified point to the end of the file, BUT, it can simply disconnect the TCP session to stop the downloading when a seek happens. Its is as efficient as it can be.
Is there some way to configure HTML5 player
No, When you tell the browser to play an MP4, you give ALL control to the browser. You there are no options to control how it works.
If you want more control, you can use Media Source Extensions. But then you will need to use more advanced file formats server side and implement all the details of how the player works. See HLS/DASH

A-Frame: Is it possible to have a-videosphere have a src link to a youtube video instead of a locally stored video file?

I want to be able to do this
<a-videosphere src="https://www.youtube.com/watch?v=diBozKDxVLI" autplay="true"></a-videosphere>
Is there any way I can without pointing to a locally stored file?
You can't render a YouTube video as a texture in WebGL. YouTube does not offer an URL to extract the video source. The official player is the only way they have to place ads and monetize the service. If you could stream a video directly you would be able to freely redistribute YouTube content. Technically, it's possible to create a web service that downloads YouTube videos and expose them through a streaming endpoint but it will go against the terms of service:
https://www.youtube.com/static?template=terms
https://aframe.io/faq/#can-i-render-youtube-videos-as-a-texture
With some manual effort, you could either proxy YouTube videos as a texture or download them locally to serve, but that is against their terms of service.

Reading a post request with image file, and convert in base64 encoding string

I wanted to ask how can we read a post request of a form that has file upload and then convert the file in base64 encoded form.
Looked at the examples shown in the play framework site, but it only explains about uploading a file and storing it in some location. But what if I need to convert the uploaded image into a base64 encoded form??
I looked through various resources, could not find what I was looking for. I just have a simple form that uploads image and need convert the upload image to base64 encoding. And yes I am using play framework.
Any help, please.
Update:
What I was actually searching for was:
val imageRaw:Option[play.api.mvc.MultipartFormData.FilePart[play.api.libs.Files.TemporaryFile]] = request.body.file("picture").map { picture =>
picture
}
Now how do I convert the imageRaw to base64 encoded string, I don't need to store the image in the disk.
Update2:
What I really had to achieve was load an image using drag and drop functionality and then load the image in a HTML5 canvas, had no problems with other browsers but since IE9 doesn't support FileReader Api, I couldn't retrieve its imageData after its loaded using the DnD functionality.
So, now I am trying to use polyfills to be able to use FileReader API in IE9, does anyone have any idea or samples of how to use them. I have been trying to use FileReader API for now, but can't get to know how to use it.

Resources