The HTML user interface for file sharing
First, let's look at how the HTML-based web page needs to be modified. As usual, we start with a standard HTML5 web page that includes a DOCTYPE definition, a document head, and a document body:
<!DOCTYPE html> <html> <head> … </head> <body> … </body> </html>
And again the first element inside the document head is a pair of <script></script> tags that includes the webrtc_polyfill.js script.
As before, this is followed by the video_call_with_chat_and_file_sharing.js code that defines the browser side logic included inline within a pair of <script></script> tags. This code differs slightly from the original basic_video_call_with_chat.js code, and we'll walk through this in detail.
Next, our simple CSS-based styles are defined within a pair of <style></style> tags, as usual with style definitions for file_sharing, file_input, file_add, file_list, file_img_src, and file_thumbnail_canvas...
