Examples Of Capturing Frame Video

Surprisingly most of the video accessible on the Internet is not available through direct video file reference. Instead it is provided via <iframe> and similar elements. Prior to HTML5 released in 2014 there was no specific HTML element to deal with video and web developers focused on using the tools they had to bring this media format to the web. With support for HTML5 in every major browser now this may shift over time, but today most of the video people watch on the web is still not delivered through <video> elements.

Frames are not at all like videos and images. In some cases they are literally open windows to be drawn into by the hosting server. In some cases they are simply smaller browser windows into which HTML is written - and that HTML may include a reference to a video. The point is that they are much more free form than direct file access. Because of this Image Surfer Pro treats Frames separately from Videos.

While Image Surfer Pro does support the automatic collection of Frame information found on a processed page, this is not recommended unless you fully understand how frame objects are being used by the hosting pages. Image Surfer Pro does provide a very powerful alternative way to collect references to frame video.

YouTube Embedded Video References

YouTube is by far the most widly known and used source of generic video content on the Internet. It provides all of the content through the use of Frames and not through direct video file access. This may be surprising as you typically upload video content to your account in the form of an MP4 file, but it is then presented as a frame.

The following examples will walk you through how to collect groups of frame videos from YouTube but the same (or very similar) process can be used on most top tier tube sites across the web. In a few cases video is still presented as Flash Video and the current release of Image Surfer Pro does not support this.

	Example Description Collecting Star Wars Fan Films posted to YouTube will be the focus of this example. While all of the content is available on YouTube and YouTube itself provides a clear and easy way to access their content, Image Surfer Pro can help you collect the specific videos you like and access them directly without ads and other distractions. Unlike other walk throughs we will provide specific details of the step by step process to what we feel is the best way to collect frame video references and get the most out of collecting video content you like. In this example we will walk through adding the first frame video to a new fusker collection. The first film added will be Darth Maul: Apprentice Configuration Notes Because we are going to capture a frame video we show the Frame Tab of the user preferences. There are just three configurations on this tab. {Automatically collect frame information found} will not be used in this example as we will be using the URL Capture Bar rather than the button. Since this is the first frame segment being added to a new fusker collection the setting of {Auto combine individual Frames into fusked Frames} will also not come into play. We will see the effect of the {Use dynamic sizing by default not specific sizing} setting when we look at the resulting Frame segment.
Origianl Web Page	Step 1: Getting The Embed Code	Step Description With the video we wish to capture displayed in the browser window, we right click on the video. From the popup menu which appears we will chose Copy Embed Code. You may be prompted whether or not you wish to give YouTube access to your windows clip board, if so, Allow Access. This will place a small amount of HTML code on the windows clip board. This is what the full HTML embed code looks like: <iframe width="854" height="480" src="https://www.youtube.com/embed/Djo_91jN3Pk" frameborder="0" allowfullscreen></iframe>
Step 2: Past Code In URL Capture Bar	Step Description The copied HTML code is directly pasted to the text area of the Image Surfer Pro URL Capture Bar. This can be done by right clicking in the text box and choosing Paste or by left clicking in the text box and typing Ctrl-V. With the HTML code in the text box the Frame Video can be added to the fusker collection by either typing Enter within the text box or clicking the button on the URL Capture Bar.	Result:
	Result Description: We see the fusker collection has a single branch with a single frame file segment. The path demonstrates the way YouTube manages embedded references to their video content. Every video you reference on YouTube will be referenced through the same path: https://www.youtube.com/embed This presents somewhat of an issue with collecting videos from YouTube - namely that all of the videos will appear within the same directory within your fusker collection. Looking closely at the segment in the segment editor we see it was giving the description of the page which was open in the browser at the time we used the URL Capture Bar to add the Frame to the collection. This is helpful, but can lead to unexpected results if you copy the HTML Embed Code from a different tab or window than you are using to run Image Surfer Pro. Unlike images and videos which will automatically size themselves to the size of the content, frame videos will typically scale the video content to match the size of the frame they are displayed in. You will note the Embed Code copied from YouTube specified both a width and height of the video. This information was stored in the frame segment and because {Use dynamic sizing by default not specific sizing} was disabled, the resulting frame was shown in the size provided by YouTube.

	Example Description Here we will add the STAR WARS: THE OLD REPUBLIC - Full Movie 2016 ALL Cinematic Trailers to our Star Wars frame video fusker collection. Configuration Notes {Automatically collect frame information found} will not be used in this example as we will be using the URL Capture Bar rather than the button. Because this is the second YouTube video being added to the fusker collection we will see the effect of the {Auto combine individual Frames into fusked Frames} configuration. We will see how the video size and description of a fusked frame segment uses the existing segment's information regardless of the {Use dynamic sizing by default not specific sizing} since this is the configuration we changed.
Origianl Web Page	Step Description Here we have used the same process to copy the Embed Code from the YouTube video, paste it to the URL Capture Bar and add the new frame video to the fusker collection. The Embed Code for this particular video was: <iframe width="854" height="480" src="https://www.youtube.com/embed/jvipPYFebWc" frameborder="0" allowfullscreen></iframe> The screen capture of the result connects directly to the Image Surfer Pro visualization page which was created at the time we made this example so you can experience having two YouTube videos on a single page.	Result:
	Result Description: We see the fusker collection still has a single branch with a single frame file segment. But this time the segment is list fusked to reference both videos. Looking closely at the segment in the segment editor we see the fusked segment still has the description and sizing information from when we added the first frame video from YouTube. Every video added from YouTube will have basically the same sizing information because of how they present the video on their pages. The fact that all of their video references resolve to the same directory can be problematic in accurately describing the content of a group of videos from YouTube. The visualization page created by Image Surfer Pro based on the list fusked frame segment shows the power of having multiple videos accessible on a single page.

	Example Description We could certainly go on adding more and more Star Wars fan videos as there are a lot of them available. But we want to demonstrate how frame videos even from the same source can be grouped together by changes in the user preferences. While it isn't a perfect solution it provides at least some flexibility that may not be readily apparent. For this we will change from Star Wars videos to our favorite music video from Lindsey Sterling: Round Table Revival. Configuration Notes By disabling the {Auto combine individual Frames into fusked Frames} configuration, we allow the next video added from YouTube to not be grouped with the previous two. The {Use dynamic sizing by default not specific sizing} configuration remains enabled.
Origianl Web Page	Step Description Here we have used the same process to copy the Embed Code from the YouTube video, paste it to the URL Capture Bar and add the new frame video to the fusker collection. The Embed Code for this particular video was: <iframe width="854" height="480" src="https://www.youtube.com/embed/-zxy9osLGOI" frameborder="0" allowfullscreen></iframe>	Result:
	Result Description: We see the fusker collection still has a single branch but the branch now has two frame file segments. Looking closely at the segment in the segment editor we see the new frame segment has used the music video page's title as the description and the sizing information has been set to Dynamic based on the changed configuration. While all the videos are still referenced through the same YouTube path, the music video is separate from the Star Wars fan films allowing you to select which you wish to view. However the frame segment strings shown in the fusker tree can not easily be associated with which is which and a guided view of the branch will simply use the description from the first frame segment - which could be misleading unless that description is manually modified. This is an issue we hope to address in a future release. The music video displayed on the visualization page is now essentially full screen. Because the sizing information is set to dynamic, the full display window size was used as the frame size at the time the visualization page was created.